Bienvenue à Blogs CodeS-SourceS Identification | Inscription | Aide

Actualités

  • Blog de Cyril DURAND, passionné de JavaScript, Ajax, ASP.net et tout ce qui touche au developpement Web Client-Side.

    View Cyril Durand's profile on LinkedIn

    hit counters

Propriétés en JavaScript : les méthodes watch et __defineGetter__ pour Firefox

J'ai récemment découvert par hasard les méthodes watch et unwatch spécifique à Firefox. Ces méthodes permettent de s'abonner à la modification de la valeur d'un attribut d'un objet.

Exemple :

var o = {p:1} o.watch("p", function (id,oldval,newval) { Sys.Debug.trace("o." + id + " changed from " + oldval + " to " + newval) return newval }); o.p = 2 o.p = 3 delete o.p o.p = 4 o.unwatch('p') o.p = 5

Affiche :

o.p changed from 1 to 2 o.p changed from 2 to 3 o.p changed from undefined to 4

Attention les méthodes watch et unwatch sont spécifique (propriétaire) à Firefox !!! Ce code ne fonctionne pas sous IE, Opera ou Safari. D'après ce que j'ai compris, il s'agit de vieux restes de Netscape.

Ce comportement peux nous être très utile lorsque l'on veut, par exemple, valider les données. En JavaScript il n'y a pas de vérification de type, grâce à ce système on pourrait s'assurer qu'on assigne bien le bon type à telle ou telle propriété et que sa valeur est correcte; l'autre intérêt est le déclenchement d'événements, ou alors l'utilisation de debugger. Malheureusement il n'existe pas de comportement similaire pour IE et cela me semble impossible de reproduire ce comportement.

Dans le même ordre d'idée, Firefox dispose des méthodes __defineGetter__ et __defineSetter__ qui permettent de définir des getter et setter comme pour les propriétés .net :

var o = {_p:3}; o.__defineGetter__('p', function(){ return this._p; }); o.__defineSetter__('p', function(value){ this._p = value; }); Sys.Debug.trace(o.p); // => 3 o.p = 5; Sys.Debug.trace(o.p); // => 5 Sys.Debug.trace(o._p); // => 5

On peut également définir les getter et setter inline :

o = { _p:7, get p() { return this._p; }, set p(value) { this._p = value; } };

Ces méthodes fonctionnent sous Safari et Firefox. Malheureusement je n'ai pas trouvé de documentation précises sur ces méthodes, d'après ce que j'ai lu avec les exemples proposés sur le site de mozilla, elles sont définies au niveau de JavaScript 1.5 c'est à dire un des implémentations de la spécification EcmaScript Revision 3, mais je n'ai rien trouvé de tel dans les specs ... Les pages sur defineGetter et defineSetter sur le wiki mozilla ne sont pas rédigées, heureusement les exemples d'utilisation sont assez explicites pour ne pas avoir la nécessité de spécifications ...

Posted: mercredi 30 janvier 2008 03:01 par cyril
Ce post vous a plu ? Ajoutez le dans vos favoris pour ne pas perdre de temps à le retrouver le jour où vous en aurez besoin :

Commentaires

FREMYCOMPANY a dit :

DefineGetter, je connaissias, mais je n'avais jamais eu vant de (un)watch. Ca peut en effet se révéler pas mal !

Tiens, une petite question : est-ce que aPrototype.get p = function() { ... } fonctionne aussi ?

# janvier 30, 2008 17:25

cyril a dit :

pas compris la question :p tu veux rajouter une méthode get_p à un prototype ? non ca ne permet pas d'avoir des propriétés. c'est d'ailleurs comme ca que les propriétés sont conseillé avec ms ajax library

# janvier 30, 2008 23:23

FREMYCOMPANY a dit :

Non, non pas du tout.

Je voudrais remplacer o = { get p: function() {} } par o.get p = function() {}.

Tu crois que ca marche ?

# février 2, 2008 10:58

Ame_Nomade a dit :

"elles sont définies au niveau de JavaScript 1.5 c'est à dire l'implémentation des spécifications EcmaScript Revision 3" : je ne crois pas, je crois plutôt que le Javascript 1.5 implémente l'EcmaScript Revision 3 ; ce n'est pas pareil.

Pour moi les getters et les setters proviennent de la future révision 4 qui n'est pas encore publiée (voir "Proposed ECMAScript 4th Edition – Language Overview" à l'adresse http://www.ecmascript.org/es4/spec/overview.pdf ).

Mais la fonction est utile, donc en attendant chacun ajoute son implémentation (voir http://ejohn.org/blog/javascript-getters-and-setters/ tout en bas ).

# juin 3, 2008 18:59

cyril a dit :

Merci, j'ai édité mon post, en effet JS 1.5 est une implémentation d'Ecmascript Revision 3.

# juin 4, 2008 10:50
Les commentaires anonymes sont désactivés

Les 10 derniers blogs postés

- [WPF] Webcast pour garantir une interface réactive par Elise's blog le il y a 57 minutes

- Dell Inspiron Mini 9 - Enfin en vente !!! par The diary of EBArtSoft le il y a 15 heures et 19 minutes

- Solution Template et Project Template dans Visual Studio par Atteint de JavaScriptite Aiguë [Cyril Durand] le il y a 18 heures et 1 minutes

- PocketIE et Assignation du SRC d'un Element IMG par Jerome Laban le il y a 18 heures et 53 minutes

- Conversion de fichiers RAW en fichier JPEG avec WPF par Perspective le il y a 19 heures et 29 minutes

- Mise à Jour du Moteur de Recherche des Arrêts de Bus de Montréal par Jerome Laban le il y a 20 heures et 13 minutes

- [WPF] XPSReader v0.2 par Blog Technique d'Audrey PETIT le il y a 21 heures et 14 minutes

- Entity Framework : providers Oracle, MySQL et PostgreSQL par Matthieu MEZIL le 09-07-2008, 10:10

- [WPF] Nouvel article sur c2i.fr par Richard Clark le 09-06-2008, 17:33

- F# nouvelle CTP 1.9.6.2 (update) par Pierrick's Blog le 09-06-2008, 13:27