1

JavaScript 2.0 Fonctions et POO

SMAHI Zakaria <z_smahi@esi.dz>

2

Formation Javascript 1.0

Initiation Syntaxe DOM et CSS

Javascript 2.0 Fonctions POO (Programmation Orientée Objet)

Ajax/Jquery Ajax JQuery

3

Fonctions  En Js tout est fonction ! Faire des fonctions !!! Mimique les concepts objets: constructeurs et

les méthodes. Définir les namespaces. Définir les portées. Puisque « fonction » est un type de données en

Js, on peut le passer comme paramètre d’une fonction ou objet de retour d’une fonction.

4

Fonction - déclaration• // déclaration de la fonctionfunction afficher(id, message){/* corps de la fonction */console.log("Message: " + message);document.getElementById(id).innerHTML = message;// return s’il y en a }• // deux exemples d'appelafficher("special1", "<p>Du contenu bien frais !</p>");afficher("special2", "Un autre contenu.");

5

Fonction - déclaration•exemplefunction perimetre(long, larg){return 2 * ( long + larg ) ;}• // appel imbriqué de fonctionsfunction afficher ( message , larg , long){ alert ( message + perimetre(larg ,long ) );}

6

Fonctions - bonnes pratiques Utiliser var pour déclarer une fonction. var maFonction = function (paramétres)

{ corps } ; exécution maFonction() ; Utiliser le pattern module « contexte ». this = contexte d’exécution. //

spécifique à la POO.

7

POO POO = Programmation Orientée Objet. OOP = Oriented Object Programming. Les fondements de la POO classique sont

valables pour Js. Forme littérale:Var Class { attribut1 : attribut2 :var methode1 = function();};

8

POO Constructeur. Function Classe(attrib1,attrib2) { this.attrib1 = attrib1;this.attrib2 = attrib2;} Var Objet = new Classe(attrib1,attrib2);•Attention : Si pas de new -> this du constructeur est «global»,pas d’erreur ou de warning !

9

POO Héritage. On peut simuler un héritage en Js.• Le prototype est un objet « modèle »•Donc le prototype du fils doit être•une instance du père, à laquelle on ajoute des•membres spécifiques•Et le constructeur du fils doit appeler celui du père•Opérateur instanceof :• console.log( maVoiture instanceof Voiture ); // true

10

«JavaScript is the only language that people feel they don’t need to learn to use it» Doug rockford

つづく………… .