Communauté francophone des développeurs 18 sites, un par langage + 1 000 000 membres +35 millions de lignes de codes Nombreux sites satellites : Blogs.CodeS-SourceS.com.

Javascript pas à pas, au trot, puis au grand galop !

Cyril DurandConsultant indépendant sur JavaScript & ASP.net Administrateur et développeur CodeS-SourceShttp://blogs.developpeur.org/Cyril/

CodeS-SourceS

Communauté francophone des développeurs18 sites, un par langage+ 1 000 000 membres +35 millions de lignes de codesNombreux sites satellites :

Blogs.CodeS-SourceS.com Search.CodeS-SourceS.com Files.CodeS-SourceS.com Emploi.CodeS-SourceS.comwww.TechnoS-SourceS.com

www.CodeS-SourceS.com

VENEZ NOUS RENCONTRER AU VILLAGE COMMUNAUTAIRE …

Agenda

JavaScript : un langage incomprisPrototype et constructorMicrosoft Ajax LibraryLe futur de JavaScriptTips & tricks : retour d’expérience

Historique JavaScript

Décembre 1995 :Netscape 2.0LiveScript => JavaScript

1996 :JScriptInternet Explorer 3

1998 : Standardisation ECMA => ECMA-262 EcmaScript

1999 :ECMAScript 3ème édition => JavaScript 1.5

Un vrai langage !

Pas juste un jouet pour la « weberie »

Langage de script / interprétéDynamiqueOrienté prototypeQuelques concepts de langage fonctionnel

6 Types de base

NumberUn seul type : 64 bits à virgule flottante (double)

StringImmutable

Null et Undefined null : valeur d’une variable qui ne vaut pas quelque choseundefined : valeur d’une variable non assigné ou non déclaré

BooleanObject

Boolean

true ou falseTout ce qui n’est pas faux est évalué comme vrai :

false0‘’NaNInfinityundefinednull

typeof, === et ||

typeofRetourne le type de base

=== (opérateur d’égalité strict)Vérifie la valeur et le type

|| retourne la première valeur non fausse

Gestion des erreurs

Function 1/6Déclaration :

Fonctions anonymes :

Constructeur de fonction

Function 2/6

add variable global mal

Function 3/6

Function 4/6

Le this se rapporte au contexte appelant

Function 5/6

apply et callMéthodes de l’objet Functionpermettent de changer le contexte appelant

Function 6/6

Portée de variable au niveau de la fonction

closure

Object 1/2

Conteneur de paire clé/valeurTableau associatifDictionary<String, Object> / HashTableClé de type string

Non triéHashmyObject.name ou myObject[‘name’]Expando attribute

Un tableau (Array) est un object !

Object 2/2

Création d’objets

Démo

Prototype 1/2

Chaque objet a un lien caché vers son prototypeL’instance du prototype est partagé entre toutes les instances du type

Person

Person.prototype

• get_firstName()• set_firstName(value)• speak()

Possibilité de modifier le prototype à n’importe quel instant

Y compris sur les types natifs

•_firstName

Prototype 2/2

Le prototype est un objetIl peut contenir un objet contenant un prototypeChainage de prototypesNotion d’héritage

Developper

Developper.prototype (Person)

Person.prototype

• get_firstName()• set_firstName(value)• speak()

• get_language()• set_language(value)• code()p.speak()

p.prototype.speak()p.prototype.prototype.speak()

•_firstName

•_language

Closure Vs Prototype

  prototype closure

IE7 25 332 ko 568 ms 108 900 ko 976 ms

FF2 39 612 ko 953 ms 56 976 ko 1 236 ms

Opera 9.23 25 008 ko 284 ms 45 882 ko 674 ms

Safari 3.0.3 55 820 ko 240 ms 59 124 ko 333 ms

Création de 100 000 instances de Foo

Prototype

Démo

Microsoft Ajax Library

Framework JavaScriptGratuit Open Source – Microsoft Permissive licenceSimplifie les notions objets Utilisé par ASP.net Ajax

Modifie le prototype de certains objets

Tips & Tricks – le debug

Tips & Tricks

Retour d’expérience

Démo

Microsoft Ajax Library

Démo

Le futur de JavaScript

JS 1.5

JS 1.6

JS 1.7

JS 1.8JS 2.0

JavaScript 1.6

Nouvelles méthodes sur les tableauxindexOflastIndexOfeveryFilterForeachmapsome

E4X : manipulation XML dans js

E4X

JavaScript 1.7

Firefox 2.0Generator

yieldArray comprehensionfor each (value in obj)

Itère sur les valeurs let

Déclare une variable de la portée des accolades

Valeur de retour multiple

JS 1.7 - generator

JS 1.7 Array Comprehension

JS 1.7 multiple return value

JS 1.8

Encore en betaFirefox 3.0

La référence technique

pour les IT Pros :technet.microsoft.com

L’engagement Microsoft pour les

développeurs :msdn.microsoft.com

S’informer - Un portail d’informations, des événements, une newsletter bimensuelle personnalisée

Se former - Des webcasts, des articles techniques, des téléchargements, des forums pour échanger avec vos pairs

Bénéficier de services - Des cursus de formations et de certifications, des offres de support technique

Visual Studio 2008 +

Abonnement MSDN Premium

Abonnement TechNet Plus :

Versions d’éval + 2 incidents support

© 2007 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.

The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after

the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

Votre potentiel, notre passion TM