Download - JavaScript pour le développeur Java
![Page 1: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/1.jpg)
JavaScript pour le développeur Java
Christophe Jollivet
![Page 2: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/2.jpg)
Christophe Jollivet
• Neurobiologiste
• Informaticien
• Homme de communauté
!
• @jollivetc
![Page 3: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/3.jpg)
Sondages
![Page 4: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/4.jpg)
Qui connait JavaScript ?
![Page 5: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/5.jpg)
Autrement qu’un copier-coller du web ?
![Page 6: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/6.jpg)
Les autres, qui se dit qu’il devrait apprendre
JavaScript ?
![Page 7: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/7.jpg)
Pourquoi JavaScript ?
![Page 8: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/8.jpg)
Atwood Law
• «Any application that can be written in JavaScript, will eventually be written in JavaScript»
• http://www.codinghorror.com/blog/2007/07/the-principle-of-least-power.html
![Page 9: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/9.jpg)
J’apprend JavaScript
![Page 10: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/10.jpg)
![Page 11: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/11.jpg)
![Page 12: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/12.jpg)
![Page 13: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/13.jpg)
![Page 14: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/14.jpg)
«JavaScript is the only language that people feel they don’t need to learn to use it»
Doug Crockford
![Page 15: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/15.jpg)
Java is to JavaScript
![Page 16: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/16.jpg)
Java is to JavaScript
What ham is to hamster
![Page 17: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/17.jpg)
http://blog.movereem.nl/images/javascript-the-good-parts-the-definitive-guide.jpg
![Page 18: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/18.jpg)
![Page 19: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/19.jpg)
http://jsbooks.revolunet.com/
![Page 20: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/20.jpg)
![Page 21: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/21.jpg)
Tour de JavaScript
![Page 22: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/22.jpg)
Types
![Page 23: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/23.jpg)
Types
• Number, String, Boolean, undefined
• Object, function
• Faiblement typé
![Page 24: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/24.jpg)
Number
• 64 bits floating point
• IEEE-754 (aka Double)
• Ecriture littérale
• 1.024e+3 === 1024
• Méthodes (toExponential, toFixed, toPrecision...)
![Page 25: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/25.jpg)
valeurs approximatives
![Page 26: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/26.jpg)
valeurs approximatives
(0.1 + 0.2) + 0.3 === 0.1 + (0.2 + 0.3)
![Page 27: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/27.jpg)
valeurs approximatives
(0.1 + 0.2) + 0.3 === 0.1 + (0.2 + 0.3)FALSE
![Page 28: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/28.jpg)
valeurs approximatives
9007199254740992 === 9007199254740992 + 1
(0.1 + 0.2) + 0.3 === 0.1 + (0.2 + 0.3)FALSE
![Page 29: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/29.jpg)
valeurs approximatives
9007199254740992 === 9007199254740992 + 1TRUE
(0.1 + 0.2) + 0.3 === 0.1 + (0.2 + 0.3)FALSE
![Page 30: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/30.jpg)
Objet
![Page 31: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/31.jpg)
Objet
![Page 32: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/32.jpg)
Objet
• Container de propriétés avec un nom et une valeur
![Page 33: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/33.jpg)
Objet
• Container de propriétés avec un nom et une valeur
• nom de propriété est une string y compris ""
![Page 34: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/34.jpg)
Objet
• Container de propriétés avec un nom et une valeur
• nom de propriété est une string y compris ""
• propriété est n’importe quelle valeur sauf undefined
![Page 35: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/35.jpg)
Déclaration objet
![Page 36: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/36.jpg)
Déclaration objet
![Page 37: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/37.jpg)
Déclaration objet
![Page 38: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/38.jpg)
Déclaration objet
![Page 39: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/39.jpg)
Déclaration objet
![Page 40: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/40.jpg)
Déclaration objet
![Page 41: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/41.jpg)
Déclaration objet
Classe anonyme
![Page 42: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/42.jpg)
Déclaration d’objet
![Page 43: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/43.jpg)
Déclaration d’objet
![Page 44: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/44.jpg)
Déclaration d’objet
![Page 45: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/45.jpg)
Déclaration d’objet
![Page 46: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/46.jpg)
Accès aux valeurs
![Page 47: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/47.jpg)
Objet et héritage
![Page 48: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/48.jpg)
Création d’objet
![Page 49: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/49.jpg)
Problème
surface surface
longueur
largeur
longueur
largeur
unRectangle anotherRectangle
![Page 50: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/50.jpg)
Problème
surface surface
longueur
largeur
longueur
largeur
unRectangle anotherRectangle
Occupation mémoire
![Page 51: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/51.jpg)
Héritage par prototype
• Un objet hérite directement d’un autre objet, il n’y a pas de notion de classe
• On place les propriétés communes dans le prototype pour la mémoire
![Page 52: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/52.jpg)
Création d’objet
![Page 53: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/53.jpg)
Solution
longueur
largeur
longueur
largeur
unRectangle anotherRectangle
surface
Prototype
![Page 54: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/54.jpg)
Résolution de propriété
• Se fait en remontant la chaîne de prototype
• il est possible de surcharger une propriété
![Page 55: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/55.jpg)
Extension• Ajout d’une méthode dans un prototype
• la méthode est alors disponible pour toutes les instances existantes et à venir
![Page 56: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/56.jpg)
for in
• itérateur sur les propriétés de l’objet
Les propriétés du prototype sont listées
![Page 57: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/57.jpg)
hasOwnProperty
• TRUE si la propriété est à l’objet et pas au prototype
Attention si foo a une propriété ‘hasOwnProperty’
![Page 58: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/58.jpg)
Introspection
![Page 59: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/59.jpg)
Fonctions
![Page 60: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/60.jpg)
Fonction
Conserve une référence sur son contexte de création
![Page 61: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/61.jpg)
Fonction
Conserve une référence sur son contexte de création
![Page 62: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/62.jpg)
Fonction
Conserve une référence sur son contexte de création
Méthode statique utilitaire
![Page 63: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/63.jpg)
Arguments
![Page 64: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/64.jpg)
Arguments
![Page 65: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/65.jpg)
Arguments
• Il n’y a pas d’erreur si le nombre d’arguments et paramètres ne correspondent pas
![Page 66: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/66.jpg)
Arguments
• Il n’y a pas d’erreur si le nombre d’arguments et paramètres ne correspondent pas
• arguments contient la liste des arguments
![Page 67: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/67.jpg)
Arguments
![Page 68: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/68.jpg)
Arguments
varargs
![Page 69: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/69.jpg)
apply
• Permet l’invocation d’une fonction en lui passant un contexte et des paramètres
![Page 70: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/70.jpg)
![Page 71: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/71.jpg)
Apply
![Page 72: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/72.jpg)
This
![Page 73: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/73.jpg)
4 patterns
• méthode
• fonction
• new
• apply
![Page 74: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/74.jpg)
this et méthode
• pattern : bar.foo()
• this référence l’objet contenant la méthode
• binding à l’invocation
![Page 75: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/75.jpg)
this et fonction
• pattern : foo()
• this est l’objet global, même si la fonction est déclarée dans une méthode
![Page 76: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/76.jpg)
this et fonction
![Page 77: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/77.jpg)
this et fonction
Pollution de l’espace global
![Page 78: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/78.jpg)
this et fonction
![Page 79: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/79.jpg)
this et fonction
![Page 80: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/80.jpg)
this et fonction
![Page 81: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/81.jpg)
this et new
• pattern : var bar = new Foo();
• création d’un objet avec lien au prototype de la fonction et this pointe cet objet
![Page 82: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/82.jpg)
this et new
![Page 83: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/83.jpg)
this et new
![Page 84: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/84.jpg)
this et new
![Page 85: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/85.jpg)
this et apply
• pattern : foo.apply(bar, args);
• this est lié à bar
![Page 86: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/86.jpg)
Apply
![Page 87: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/87.jpg)
Coercition de type
![Page 88: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/88.jpg)
Coercition de type
![Page 89: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/89.jpg)
Coercition de type
• Forcer le type d’une variable
![Page 90: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/90.jpg)
Coercition de type
• Forcer le type d’une variable
• == fait la coercition de type
![Page 91: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/91.jpg)
Coercition de type
• Forcer le type d’une variable
• == fait la coercition de type
• === ne fait pas la coercition de type
![Page 92: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/92.jpg)
Coercition de type
• '1' ==1 TRUE
• '1'===1 FALSE
![Page 93: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/93.jpg)
Coercition de type
![Page 94: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/94.jpg)
Coercition de type
• false == 'false' FALSE
![Page 95: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/95.jpg)
Coercition de type
• false == 'false' FALSE
• false == '0' TRUE
![Page 96: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/96.jpg)
Coercition de type
• false == 'false' FALSE
• false == '0' TRUE
• " \t\r\n " == 0 TRUE
![Page 97: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/97.jpg)
Coercition de type
• false == 'false' FALSE
• false == '0' TRUE
• " \t\r\n " == 0 TRUE
• ",,," == new Array(4) TRUE
![Page 98: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/98.jpg)
Coercition de type
• false == undefined FALSE
• false == null FALSE
• null == undefined TRUE
![Page 99: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/99.jpg)
Coercition de type
![Page 100: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/100.jpg)
Coercition de type
• if( foo === null || foo === undefined )
![Page 101: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/101.jpg)
Coercition de type
• if( foo === null || foo === undefined )
• if( foo == null )
![Page 102: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/102.jpg)
Coercition type (bonus)
![Page 103: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/103.jpg)
Coercition type (bonus)
• foo=+foo
![Page 104: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/104.jpg)
Coercition type (bonus)
• foo=+foo
• foo = parseInt(foo,10)
![Page 105: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/105.jpg)
Coercition type (bonus)
• foo=+foo
• foo = parseInt(foo,10)
• foo = parseFloat(foo,10)
![Page 106: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/106.jpg)
Coercition type (bonus)
• foo=+foo
• foo = parseInt(foo,10)
• foo = parseFloat(foo,10)
‘10.2a’
![Page 107: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/107.jpg)
Coercition type (bonus)
• foo=+foo
• foo = parseInt(foo,10)
• foo = parseFloat(foo,10)
‘10.2a’
NaN
![Page 108: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/108.jpg)
Coercition type (bonus)
• foo=+foo
• foo = parseInt(foo,10)
• foo = parseFloat(foo,10)
‘10.2a’
NaN
10
![Page 109: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/109.jpg)
Coercition type (bonus)
• foo=+foo
• foo = parseInt(foo,10)
• foo = parseFloat(foo,10)
‘10.2a’
NaN
10
10.2
![Page 110: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/110.jpg)
Coercition et transitivité
![Page 111: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/111.jpg)
Coercition et transitivité
• 0 =='' TRUE
![Page 112: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/112.jpg)
Coercition et transitivité
• 0 =='' TRUE
• 0 =='0' TRUE
![Page 113: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/113.jpg)
Coercition et transitivité
• 0 =='' TRUE
• 0 =='0' TRUE
• ''=='0'
![Page 114: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/114.jpg)
Coercition et transitivité
• 0 =='' TRUE
• 0 =='0' TRUE
• ''=='0' FALSE
![Page 115: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/115.jpg)
Piège
![Page 116: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/116.jpg)
Truthy et Falsy
![Page 117: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/117.jpg)
Truthy et Falsy
• false, "", 0, null, undefined, NaN, void sont FALSY
![Page 118: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/118.jpg)
Truthy et Falsy
• false, "", 0, null, undefined, NaN, void sont FALSY
• Tous les autres sont TRUTHY
![Page 119: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/119.jpg)
Truthy et Falsy
• false, "", 0, null, undefined, NaN, void sont FALSY
• Tous les autres sont TRUTHY
• même "0" et "FALSE"
![Page 120: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/120.jpg)
Truthy et Falsy
• false, "", 0, null, undefined, NaN, void sont FALSY
• Tous les autres sont TRUTHY
• même "0" et "FALSE"
• if( array.length )
![Page 121: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/121.jpg)
Truthy et Falsy
• false, "", 0, null, undefined, NaN, void sont FALSY
• Tous les autres sont TRUTHY
• même "0" et "FALSE"
• if( array.length )
• if( string )
![Page 122: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/122.jpg)
Valeur par défaut
![Page 123: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/123.jpg)
Valeur par défaut
Attention si b vaut 0 car 0 est falsy
![Page 124: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/124.jpg)
Appel sécurisé
![Page 125: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/125.jpg)
![Page 126: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/126.jpg)
![Page 127: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/127.jpg)
Point virgule
![Page 128: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/128.jpg)
Point virgule
• Séparation d’expression
![Page 129: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/129.jpg)
Point virgule
• Séparation d’expression
• Pas toujours obligatoire
![Page 130: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/130.jpg)
Point virgule
• Séparation d’expression
• Pas toujours obligatoire
• Pose problème dans la minification
![Page 131: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/131.jpg)
Point virgule
• Séparation d’expression
• Pas toujours obligatoire
• Pose problème dans la minification
• Grand débat sur quand il est nécessaire
![Page 132: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/132.jpg)
Point virgule
https://github.com/twitter/bootstrap/issues/3057
![Page 133: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/133.jpg)
Point virgule
![Page 134: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/134.jpg)
Point virgule
![Page 135: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/135.jpg)
Scope
![Page 136: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/136.jpg)
Scope
![Page 137: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/137.jpg)
Scope
• Syntaxe à « la C » avec bloc
![Page 138: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/138.jpg)
Scope
• Syntaxe à « la C » avec bloc
• Le scope est la fonction
![Page 139: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/139.jpg)
Scope
• Syntaxe à « la C » avec bloc
• Le scope est la fonction
• Déclaration de variable avec «var»
![Page 140: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/140.jpg)
Scope
• Syntaxe à « la C » avec bloc
• Le scope est la fonction
• Déclaration de variable avec «var»
• /!\ déclaration automatique
![Page 141: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/141.jpg)
Déclaration
![Page 142: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/142.jpg)
Déclaration
![Page 143: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/143.jpg)
Hoisting
• Déplace les déclarations en tête du bloc
![Page 144: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/144.jpg)
Hoisting
![Page 145: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/145.jpg)
Hoisting
![Page 146: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/146.jpg)
Hoisting
![Page 147: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/147.jpg)
Closure
• Une fonction objet contient :
• une fonction (nom, paramètres, body)
• une référence à l’environnement où elle a été créée (contexte)
![Page 148: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/148.jpg)
Closure
![Page 149: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/149.jpg)
Closure
•Pollution de Global •Risque de collision de nom •names est modifiable
![Page 150: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/150.jpg)
Closure
![Page 151: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/151.jpg)
Closure
•Lent car construction de names à chaque appel
![Page 152: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/152.jpg)
Closure
![Page 153: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/153.jpg)
Closure
![Page 154: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/154.jpg)
Closure
![Page 155: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/155.jpg)
Exception
![Page 156: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/156.jpg)
throw
![Page 157: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/157.jpg)
try catch finally
![Page 158: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/158.jpg)
Séparation de code
![Page 159: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/159.jpg)
namespace
• Séparation de code pour limiter les collisions de nom
• Masquer le fonctionnement de votre librairie
![Page 160: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/160.jpg)
Namespace
• Tout n’est pas dans un bloc • Tout est public
![Page 161: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/161.jpg)
IIFE
• Immediatly Invoked Function Expression
• Fonction exécutée au chargement du script et qui renvoie un objet avec les fonctions/variables utiles.
![Page 162: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/162.jpg)
IIFE
![Page 163: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/163.jpg)
IIFE
![Page 164: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/164.jpg)
IIFE
![Page 165: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/165.jpg)
IIFE
![Page 166: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/166.jpg)
Callback
![Page 167: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/167.jpg)
Callback
• fonction donnée en paramètre pour des opération asynchrone
![Page 168: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/168.jpg)
callback
![Page 169: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/169.jpg)
callback
![Page 170: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/170.jpg)
callback
![Page 171: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/171.jpg)
Promise
![Page 172: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/172.jpg)
Callback
![Page 173: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/173.jpg)
![Page 174: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/174.jpg)
Pyramide of doom
![Page 175: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/175.jpg)
![Page 176: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/176.jpg)
![Page 177: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/177.jpg)
Promise
• Objet avec une méthode then qui prend 3 paramètres
• success callback
• failure callback
• progress callback (pas obligatoire)
![Page 178: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/178.jpg)
Promise
• 3 états possibles
• unfulfilled or pending
• fulfilled or resolved
• failed or rejected
![Page 179: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/179.jpg)
![Page 180: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/180.jpg)
![Page 181: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/181.jpg)
![Page 182: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/182.jpg)
![Page 183: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/183.jpg)
![Page 184: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/184.jpg)
![Page 185: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/185.jpg)
Résumé
![Page 186: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/186.jpg)
Résumé
• JavaScript s’apprend !
• Scope / Hoisting
• this (constructeur et callback)
• Héritage par prototype
• asynchrone
![Page 187: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/187.jpg)
Industrialisation ?
![Page 188: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/188.jpg)
JS c’est lent
![Page 189: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/189.jpg)
![Page 190: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/190.jpg)
• Enormes progrès sur les VM (V8, Rhino, XMonkey)
![Page 191: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/191.jpg)
• Enormes progrès sur les VM (V8, Rhino, XMonkey)
• compilateur JIT
![Page 192: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/192.jpg)
• Enormes progrès sur les VM (V8, Rhino, XMonkey)
• compilateur JIT
• Cible du transpiling
![Page 193: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/193.jpg)
• Enormes progrès sur les VM (V8, Rhino, XMonkey)
• compilateur JIT
• Cible du transpiling
• Coffeescript, Dart, GWT...
![Page 194: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/194.jpg)
JS n’est pas maintenable
![Page 195: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/195.jpg)
![Page 196: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/196.jpg)
![Page 197: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/197.jpg)
![Page 198: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/198.jpg)
JS est artisanal
![Page 199: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/199.jpg)
IndustrialisationBuild
Audit
Tests
![Page 200: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/200.jpg)
Structure
![Page 201: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/201.jpg)
Modularisation
• AMD : Asynchronous Module Definition
• Chargement asynchrone en parallèle dans son propre scope
• requirejs, Dojo, JQuery, Curl, Backdraft
![Page 202: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/202.jpg)
Modularisation
![Page 203: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/203.jpg)
Modularisation
![Page 204: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/204.jpg)
Modularisation
![Page 205: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/205.jpg)
Modularisation
![Page 206: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/206.jpg)
Modularisation
![Page 207: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/207.jpg)
Automatisation
![Page 208: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/208.jpg)
NPM
• Node Package Module
• installation d’outils et de plugins
• Permet l’installation d’outils de façon globale ou locale
![Page 209: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/209.jpg)
Grunt
• The JavaScript Task Runner
• 2 fichiers
• package.json -> dépendances et plugins
• Gruntfile.js -> configuration
![Page 210: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/210.jpg)
Gruntfile.js
![Page 211: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/211.jpg)
Gruntfile.js
![Page 212: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/212.jpg)
package.json
![Page 213: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/213.jpg)
Bower
• Provisionnement de dépendances pour la webapp
• Clone de repository Github
![Page 214: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/214.jpg)
bower.json
![Page 215: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/215.jpg)
Yeoman
• Scaffolding
• Intégration de Yo, Grunt et Bower
• Générateur
![Page 216: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/216.jpg)
Tests
![Page 217: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/217.jpg)
Jasmine
![Page 218: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/218.jpg)
Jasmine
![Page 219: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/219.jpg)
Jasmine
![Page 220: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/220.jpg)
Jasmine
![Page 221: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/221.jpg)
Jasmine spies
![Page 222: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/222.jpg)
Jasmine spies
![Page 223: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/223.jpg)
Jasmine spies
![Page 224: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/224.jpg)
Jasmine spies
![Page 225: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/225.jpg)
Alternative
• Mocha.js
• Qunit
![Page 226: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/226.jpg)
Bonus
• Rapport de tests dans différents formats
• Couverture de code
![Page 227: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/227.jpg)
Chai.js
![Page 228: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/228.jpg)
Sinon.js
• Mock, Spies.....
• Fake sur XMLHttpRequest
• Fake sur Timer
![Page 229: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/229.jpg)
CasperJs
• Headless scriptable Webkit
• Screenshot
• Test recorder dans Chrome
![Page 230: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/230.jpg)
CasperJs
![Page 231: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/231.jpg)
Integration Continue
![Page 232: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/232.jpg)
Job dédié
• commande shell
• NodeJS Jenkins Plugin
![Page 233: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/233.jpg)
Plugin Maven
• Lancement des outils en ligne de commande
![Page 234: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/234.jpg)
Aggregation résultats
• Reporter au format XUnit
• Plugin Jenkins TAP
![Page 235: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/235.jpg)
Framework
![Page 236: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/236.jpg)
Frameworks
![Page 237: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/237.jpg)
Frameworks
![Page 239: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/239.jpg)
Frameworks
• Fonctionnalités diverses
• binding
• routing
• templating
• ......
![Page 240: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/240.jpg)
Qualité
![Page 241: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/241.jpg)
use strict
!
• En haut du script ou dans une fonction
• Transforme en erreur certaines fautes
• déclaration implicite de variable
• syntaxe octale
• double propriété
![Page 242: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/242.jpg)
JSLint / JSHint
• attention cela fait mal.
• utiliser dès le début avant les mauvaises habitudes !
• en ligne ou en plugin
![Page 243: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/243.jpg)
Sonar
• Plugin pour le JavaScript
• tests, coverage, métriques,
![Page 244: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/244.jpg)
Tooling
![Page 245: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/245.jpg)
IDE
![Page 246: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/246.jpg)
IDE
• Difficile....
![Page 247: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/247.jpg)
IDE
• Difficile....
• Il faut essayer
![Page 248: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/248.jpg)
Console des navigateurs
• Debugging
• Test en live
![Page 249: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/249.jpg)
Questions ?
![Page 250: JavaScript pour le développeur Java](https://reader037.vdocuments.fr/reader037/viewer/2022103115/5565f703d8b42a2a4d8b4701/html5/thumbnails/250.jpg)
Creative CommonsAttribution — You must attribute the work in the manner specified by the author or licensor (but not in any way that suggests that they endorse you or your use of the work). !Noncommercial — You may not use this work for commercial purposes. !Share Alike — If you alter, transform, or build upon this work, you may distribute the resulting work only under the same or similar license to this one.