Félicitation à Sam Stephenson pour la sortie de la version 1.5 du framework Prototype et surtout de l'aide en ligne qui manquait cruellement aux versions précédentes.
Y'a plus qu'à !
Balise - prototype
mardi 5 décembre 2006
Le prototypage...
Par Bruno le mardi 5 décembre 2006, 08:40 - Informatique
Lors de la formation AJAX, on aborde cette facette du Javascript peu connue.
Une définition du Prototypage est : ''un prototype est une instance d'une classe qui possède des attributs et des méthodes par défaut qui sont utilisés si les instances de la classe ne les redéfinissent pas''. En Javascript, on peut tout prototyper.
Pour faire ces exemples, vous pouvez utiliser le shell qui vous permet de faire de la ligne de commande en Javascript dans le contexte de la page en cours.
La syntaxe du prototypage est la suivante :
//Définition d'une classe
Voiture = function(marque, modele) {
this.marque= marque;
this.modele= modele;
}
//Exemple :
voiture1 = new Voiture('BMW', 'Classe 1');
//On rajoute une méthode qui s'ajoute à tous les objets Voiture en prototypant la classe Voiture
Voiture.prototype.demarre = function() {
return 'Vrooom';
}
//essai
voiture1.demarre()
voiture1.demarre()
>>Vrooom
Si une méthode demarre() avait été définie dans la classe Voiture, elle n'aurait pas été écrasée par la méthode ajouté par prototype.
Nous allons maintenant prototyper l'objet natif Array du Javascript
Array.prototype.compte = function(){
return this.length;
}
//définition d'un tableau
tableau = ['choux','carotte','poireau']
tableau = ['choux','carotte','poireau']
>>choux,carotte,poireau
//Appel de la methode ajoutée
//Appel de la methode ajoutée
tableau.compte()
>>3
//Appel de la proprieté length
//Appel de la proprieté length
tableau.length
>>3
Prenons un cas un peu plus tordu (c'est au final l'objet de ce post...)
coll = document.getElementsByTagName('*')
>>[object HTMLCollection]
coll.length
>>90
coll.compte()
>>TypeError on line 1: coll.compte is not a function
En effet, getElementsByTagName ne retourne pas un tableau, contrairement à ce qu'indique Aptana dans sa documentation contextuelle, mais un Dom Collection
//on demande le type de coll
coll.constructor.name
>>Object
//on demande le type de tableau
tableau.constructor.name
>>Array
Les deux sont différents. Nous allons donc essayer de prototyper les Object :
Object.prototype.compte = function(){ return this.length;}
>>function () { return this.length; }
coll.compte()
>>90
Mais sous Internet Explorer, ça ne fonctionnera pas car le script n'a pas accès à ces objets là.
Et comme dirait Nico : "Les types des DOM ne sont pas dans l'arbre d'héritage du JS"...
