Ce diaporama a bien été signalé.
Le téléchargement de votre SlideShare est en cours. ×

Javascript & tools

Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Publicité
Prochain SlideShare
Introduction à Node.js
Introduction à Node.js
Chargement dans…3
×

Consultez-les par la suite

1 sur 22 Publicité

Plus De Contenu Connexe

Diaporamas pour vous (20)

Similaire à Javascript & tools (20)

Publicité

Javascript & tools

  1. 1. Slim Soussi Vladimir Kostarev David Catuhe David Rousset Intel Intel Microsoft Microsoft
  2. 2. David Catuhe / Microsoft David Rousset / Microsoft http://blogs.msdn.com/eternalcoding http://blogs.msdn.com/davrous davca@microsoft.com davrous@microsoft.com
  3. 3. Agenda • Un peu d’histoire • Fondamentaux • Les outils • Quelques frameworks utiles…
  4. 4. Un peu d’histoire • Développé par Brendan Eich de Netscape en 1995 • Nom de code Mocha puis renommé en LiveScript et finalement en JavaScript • Première version avec Netscape 2.0 en Septembre 1995 • Peu de rapport avec Java (choix du nom surtout dicté par des raisons marketings de l’époque) • Novembre 1996 : Soumission à l’ECMA et apparition de l’ECMAScript
  5. 5. Un peu d’histoire • Juin 1997 : Première version de l’ECMAScript • Juin 2011 : ECMAScript 5.1 • La marque « JavaScript » est sous copyright de Oracle • JavaScript est sorti du pur web: • Développement coté serveur (nodeJS) • Développement applicatif (Windows 8) 6
  6. 6. Fondamentaux de JavaScript JavaScript est : • Construit autour de fonctions • Un langage à base de prototype • Un langage de script (mais pas que…) • Dynamique • Faiblement typé
  7. 7. Fondamentaux de JavaScript En JavaScript tout est fonction. Elles servent à : • Faire des fonctions (!!!) • Mimiquer les concepts objets • Constructeurs • Méthodes • Définir des namespaces • Définir la portée PUZZLE.update = function () { for (var index = 0; index < PUZZLE.blocks.length; index++) { var block = PUZZLE.blocks[index]; PUZZLE.updateBlock(block); } }; 9
  8. 8. 10
  9. 9. Fondamentaux de JavaScript Un langage à base de prototypes : • Principe de clonage d’objets modèles (le prototype) • Délégation des méthodes vers le prototype • « Remplace » classes et héritage this.prototype.add = function (otherVector) { return new Vector2(this.x + otherVector.x, this.y + otherVector.y); }; 11
  10. 10. 12
  11. 11. Fondamentaux de JavaScript Un langage de script : • Compilé à la volée par les navigateurs modernes (JIT) • Profite des dernières avancées des compilateurs • Multi cores • Optimisations 13
  12. 12. Fondamentaux de JavaScript Un langage dynamique et faiblement typé : • Les types sont associés aux valeurs et non aux variables • Par exemple : • Une variable x peut être associée à un numérique à un instant et à une chaine de caractères plus tard • Types de valeurs supportés : • Number • String • Boolean • Function • Array • Object 14
  13. 13. 15
  14. 14. Les outils Les barres F12 des navigateurs • Natif dans IE9/10 et Chrome • Via Firebug dans Firefox • Via DragonFly pour Opera
  15. 15. Les outils • Microsoft Visual Studio 2010 + Web Standards Update • Notepad++  • http://jsfiddle.net/ • http://prefixmycss.com/ • http://ie.microsoft.com/testdrive/ • http://jsonformatter.curiousconcept.com/ • http://jslint.com/ • http://erik.eae.net/playground/regexp/regexp.html • http://code.google.com/p/jsfuzzer/ • http://fmarcia.info/jsmin/test.html • … 18
  16. 16. 19
  17. 17. Quelques frameworks utiles… • jQuery : http://jquery.com/ • jQuery UI : http://jqueryui.com/ • Modernizr : http://www.modernizr.com/ • Qunit : http://qunitjs.com/ • YUI : http://developer.yahoo.com/yui/ • SproutCore : http://www.sproutcore.com/ • Midori : http://www.midorijs.com/ • Fleegix : http://js.fleegix.org/ • Prototype : http://www.prototypejs.org/ • Dojo : http://dojotoolkit.org/ • Mootools : http://mootools.net/ • MochiKit : http://mochi.github.com/mochikit/ • …
  18. 18. David Catuhe : davca@microsoft.com - http://blogs.msdn.com/eternalcoding David Rousset : davrous@microsoft.com – http://blogs.msdn.com/davrous

×