passer une fonction dans un parametre d'une propriété de classe

Version imprimable

Bonjour (oui je sais il est tard mais je trouve pas de solution à mon problème :aie: ) ...

bon un petit exemple qui illustre mon problème :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 <html> <head> <script type='text/javascript'> function MyClass(pNom, pPrenom) { this.nom = pNom; this.prenom = pPrenom; } function MyClass.prototype.Test(res) { alert('ok'); alert(this.nom + " " + this.prenom); } function MyClass.prototype.appel(f) { alert('appel'); f(); } function MyClass.prototype.debut() { this.appel(this.Test); } </script> </head> <body> <input type="button" value="test" onclick="var o = new MyClass('le nom','le prenom'); o.debut();" /> </body> </html>
explication : je souhaite que lorsque j'appel une methode de ma classe, celle-ci appel une autre méthode en donnant le nom d'une troisieme autre methode (j'espere que vous m'avez comprit sinon suffit de voir les étappes -> debut -> appel -> Test)

bref; ce petit test demontre que ma reference "THIS" perd un peu les pedales lorsqu'il tombe dans la methodes Test.
Du coup, quand je veut faire this.nom et this.prenom il m'affiche "undefined" :cry: (j'imagine que THIS refere document ou un truc dans le genre...) :?

Cela peut paraitre absurde mais j'ai met raisons; je repete ceci n'est qu'une illustration.

Si quelqu'un peut m'aider à trouver une solution tout en gardant ce principe (methode qui appel une autre methode donner en parametre, le tout dans la meme classe) je vous serai EXTREMEMENT RECONNAISSANT !!!

sur ce; je vais dormir faire plein de cauchemard :aie: :cry: :cry:

05/08/2006, 12h20
FremyCompany
La solution simple (lol, une fois qu'elle est programmée) et efficace est l'auto-storing... Le principe est que ta classe se stocke de manière durable et globale et qu'au lieu de faire référence à this, les fonctions fassent référence à la zone de stockage.
J'ai un code perso unique dans le monde, mais je suis radin (lol)

Sinon, tu as toujours :
A) Eval :

Code:

eval("this.Test()")

B) La référence :
Code:

1 2 3 function Invoke (ref, funcName) { return ref[funcName](); }
05/08/2006, 12h36
CAML

mmmh, tout d'abord merci de t'interessé a mon problème :)

Je ne comprend pas tres bien ce que tu fais avec eval() et encore moins ce que fait ta fonction Invoke.
Peut tu m'eclaire par un tout petit exemple complet ?
Merci beaucoup à toi !

A la volée; devrait afficher deux alerts;

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
MyClass = function(name, lastName) {
    this.name=name; this.lastName=lastName;
    this.toString=function() {
         return this.lastName.toUpperCase() + " " + this.name;
    }
    this.alert=function() {
         alert(this.toString());
    }
    this.invoke=function(functionName) {
        eval("this." + functionName + "();")
    }
    this.invokeShared=function(ref, functionName) {
        ref[functionName]();
    }
}
 
MyClassInstance = new MyClass("Francois", "Remy");
MyClassInstance .invoke("alert");
MyClassInstance .invokeShared(MyClassInstance, "alert");

Je viens de lire, tester et comprendre ton exemple qui est vraiment tres interessant ! merci !
Néanmoins j'ai peur que je sois toujours coincé. Je vois que tu as l'air vraiment bien informé sur le javascript peut etre pourrait tu me dire si mon probleme a une solution !

Voila, je travaille en ASP.NET et j'utilise un composant libre (AJAXPRO) qui me permet de faire des requetes tres facilement sur mon serveur. bref ceci n'est pas tres important...

exemple :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 MyClass = function() { this.nom = "LeNom" this.prenom = "LePrenom" this.CallAjax() { MaMethodePourFaireRequeteAjax(this.nom, this.prenom, this.EndCallBack); } this.EndCallBack(res) { //traitement de la reponse // quand la requete asynchrone se termine, j'arrive ici avec this qui ne pointe plus sur MyClass // note: le parametre "res" est en fait la reponse retourner par le serveur } } var monObjet = new MyClass(); monObjet.CallAjax();
Voila le probleme se situe au niveau du this.EndCallBack, je perd toujours la reference de ma classe quand j'arrive dans EndCallBack

j'ai deja essaié au niveau de l'appel de changer

Code:

MaMethodePourFaireRequeteAjax(this.nom, this.prenom, this.EndCallBack);

par

Code:

MaMethodePourFaireRequeteAjax(this.nom, this.prenom, function(res){this.EndCallBack(res, this)});

de sorte a ce que j'envoie la reference mais en fait en reflechissant je fait exactement la meme chose et je ne resoud aucunement le probleme :cry:

je ne parviens pas a trouver une solution :aie: tout en gardant l'utilisation de la methode ajax dans une classe

05/08/2006, 14h19
FremyCompany
En utilisant ma méthode d'auto-storing, tu pourrais laisser le code comme présenté, à condition d'effectuer un traitement d'auto-storage...

Seulement, comme je te l'ai dit, ca nécéssite que tu cherche le code par toi même, vu que je n'ai pas trop envie de donner le mien....

Sinon, il existe une methode simple (j'avoue que je ne l'aime pas à cause du fait qu'elle partage des variables entres fonctions sans raison) mais qui a fait ses preuves :
Code:

1 2 3 4 5 var This=this; var callBack=function(res) { This.Function(res); } callAJAX(args, callBack);
05/08/2006, 15h19
CAML

mettre la reference this dans une autre variable globale j'y avais penser mais il y a un gros probleme !

dans mon cas c'est un traitement ASYNCHRONE ! donc il se pourait tres bien que dans le traitement du CallBack j'utilise une This global qui a deja été reaffecter par un autre appel ajax !

en tout cas merci pour ton aide ! par hazard aurai tu des articles ou autre sur l'auto storing histoire que je trouve ma solution ? je comprend que tu veuilles garder ton code c'est ton droit ;)

edit : donc au lieu d'utiliser this tu utilises une reference globale ? ces reference globales ont été creer a la creation de l'objet ? mais alors comment pointer sur la bonne reference globale selon l'objet dans leque on se trouve ?

lol, désolé de m'être fait mal comprendre ;)

Code:

1
2
3
4
5
6
7
this.beginAJAX = function () {
    var This=this; var callBack=function(res) { 
        This.Function(res);
    }
 
    callAJAX(args, callBack);
}

05/08/2006, 16h02
FremyCompany

En réponse au reste de ton post :

Citation:

Envoyé par CAML

en tout cas merci pour ton aide ! par hazard aurai tu des articles ou autre sur l'auto storing histoire que je trouve ma solution ? je comprend que tu veuilles garder ton code c'est ton droit ;)

Lol, c'est moi qui l'ai inventé, donc ca risque d'être difficile...

En fait, je suis occupé de me demander si je vais pas mettre en ligne un tutoriel prochainement... Si jamais je venais à le faire, je te préviendrais...

Citation:

Envoyé par CAML

edit : donc au lieu d'utiliser this tu utilises une reference globale ? ces reference globales ont été creer a la creation de l'objet ? mais alors comment pointer sur la bonne reference globale selon l'objet dans leque on se trouve ?

C'est la toute l'astuce de l'auto-storing ;)
05/08/2006, 16h23
CAML

une autre question : y a t'il pas un danger sur l'espace memoire utiliser avec cette technique parce que avec le fait de tout mettre en global je m'y perd un peu avec ces passage par reference ou par valeur 8O

sinon je crois que je vais abandonner la methode de travailler avec des CallBack dans des classes :(

Avec cette methode la, tu ne mets rien en global...

Citation:

Envoyé par FremyCompany

lol, désolé de m'être fait mal comprendre ;)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
MyClass=function() {
  // ...
  this.beginAJAX = function () {
      var This=this; var callBack=function(res) { 
          This.Function(res);
       }
 
      callAJAX(args, callBack);
   }
   // ...
}

Arg tu es trop rapide ! (lol) j'avais pas vu ta premier réponse (sur les deux de suite) !
Code:

1 2 3 4 5 6 7 8 9 10 11 MyClass=function() { // ... this.beginAJAX = function () { var This=this; var callBack=function(res) { This.Function(res); } callAJAX(args, callBack); } // ... }
avec cela This n'est visible uniquement dans l'objet alors ??? et le seul 'inconvenient' que tu disais c'est que This est partager par toutes les fonction de l'objet ? ou est le probleme a partir du moment ou This n'a uniquement pour but que de stocker la reference this ?

encore merci de ton soutien ;)

salut,

j'ai pas regardé le code xhr, mais en me basant sur l'exemple du premier post la fonction call ne serait-elle pas suffisante ?

son premier paramètre permet justement de spécifier la référence voulu.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 MyClass=function(pNom, pPrenom) { this.nom = pNom; this.prenom = pPrenom; } MyClass.prototype.Test=function(res) { alert('ok'); alert(res); alert(this.nom + " " + this.prenom); } MyClass.TestS=function(res) { alert('ok'); alert(res); alert(this.nom + " " + this.prenom); } MyClass.prototype.appel=function(f) { f.call(this,'toto'); } MyClass.prototype.debut=function() { /* this.Test.call(this,'totoparam'); MyClass.TestS.call(this,'totoparam');*/ this.appel(this.Test); this.appel(MyClass.TestS); }
@FremyCompany
préviens moi aussi si tu fais un tuto sur ta méthode, j'ai pas tout compris...

Bon je confirme cette solution que tu m'a donnée marche bien :
Code:

1 2 3 4 5 6 7 8 9 10 11 MyClass=function() { // ... this.beginAJAX = function () { var This=this; var callBack=function(res) { This.Function(res); } callAJAX(args, callBack); } // ... }
j'ai tester, la variable This n'est pas global (comme tu me l'as confirmer mais je voulais en etre sur ;) ) Maintenant je voudrais comprendre quel sont les desavantage de cette pratique ? est ce que ce code n'est pas performant ? (gonflage de memoire et tout ca) ?

Citation:

j'avoue que je ne l'aime pas à cause du fait qu'elle partage des variables entres fonctions sans raison

En fait This est partager pour tout les membres de l'instance de mon objet ?

alors sinon j'ai une dernier petite question :oops:
Code:

1 2 3 4 5 6 7 8 9 MyClass = function() { } MyClass.prototype.f1 = function() { }
Code:

1 2 3 4 5 6 7 MyClass = function() { MyClass.prototype.f1 = function() { } }
j'ai vu ces 2 genre d'ecriture, est ce qu'elle vallent la meme chose ?? personellement je prefere la 2é pour des raison de lisibilité ... neanmoins est ce qu'elle valent la meme chose ???

voila ce sera tout (et tu m'as deja bien aider un grand merci !)

05/08/2006, 19h31
FremyCompany

Lol, tout pareil ;)
Pour le 1er cas, et pour le 2e...
05/08/2006, 20h05
CAML

Oki c'est cool je vais pouvoir continuer à utiliser la 2é methode car je trouve que c'est plus lisible :p

Post résolu, j'espere que cela sera utile à d'autres personnes que moi.
05/08/2006, 21h26
tthierry
faites gaffe quand même lorsque vous utilisez des fermetures, ça peut bouffer des ressources inutilement...

...surtout si vous pensez que cette méthode est mieux pour creer des objets (ce qui n'est pas le cas vu que ça risque d'empêcher le boulôt du gc) :
Code:

1 2 3 4 5 6 7 8 MyClass = function() { MyClass.prototype.f1 = function() { } }
sur le principe :

http://jibbering.com/faq/faq_notes/closures.html (complet mais en anglais)
http://developer.mozilla.org/fr/docs..._en_JavaScript (sa traduction mais incomplète)

+

Il vaut mieux que j'utilise cette methode alors ?
Code:

1 2 3 4 5 6 7 8 9 MyClass = function() { } MyClass.prototype.f1 = function() { }

06/08/2006, 12h25
FremyCompany
Pour conserver un mode de déclaration interne sans risque d'ambiguité :
Code:

1 2 3 4 5 6 7 MyClass = function() { this.f1 = function() { } }
06/08/2006, 14h24
tthierry
pour schématiser, placer une fonction à l'intérieur d'une autre revient à créer une fermeture.
celà peut être utile, comme utiliser des ressources pour rien.
moralité -> si on peut s'en passer c'est mieux.

concrètement, ce qui se passe avec cette syntaxe :
Code:

1 2 3 4 5 6 7 8 MyClass = function() { this.f1 = function() { } }
- les variables locales du constructeur vivront jusqu'à disparition de l'objet.
- à chaque instanciation les méthodes de la classe appartiennent à l'instance et elle seule (n instance -> n jeux de méthodes en mémoire).

concrètement, ce qui se passe avec cette syntaxe :
Code:

1 2 3 4 5 6 7 8 9 10 MyClass = function() { } MyClass.prototype.f1 = function() { }
- les variables locales du constructeur disparraissent de la mémoire dès la fin de son appel.
- les méthodes de la classe sont partagées pour toutes les instances (n instances -> un seul jeu de méthodes en mémoire).

ps: si je me plante merci de me corriger
06/08/2006, 17h05
CAML
Citation:
Envoyé par tthierry

concrètement, ce qui se passe avec cette syntaxe :

Code:

1 2 3 4 5 6 7 8 9 10 MyClass = function() { } MyClass.prototype.f1 = function() { }

- les variables locales du constructeur disparraissent de la mémoire dès la fin de son appel.
- les méthodes de la classe sont partagées pour toutes les instances (n instances -> un seul jeu de méthodes en mémoire).
C'est le mot clé prototype qui fait cela ?

et donc le fait d'imbriquer comme cela :
Code:

1 2 3 4 5 6 7 MyClass = function() { MyClass.prototype.f1 = function() { } }
Cela donne quoi ? Cela sert a rien de mettre un prototype imbriquer dans un objet alors?
06/08/2006, 18h36
tthierry
>C'est le mot clé prototype qui fait cela ?

pour ce qui est du partage des méthodes je dirais oui.

>et donc le fait d'imbriquer comme cela :
Code:

1 2 3 4 5 6 7 8 MyClass = function() { MyClass.prototype.f1 = function() { } }
>Cela donne quoi ? Cela sert a rien de mettre un prototype imbriquer dans un objet alors?

pour ce qui est des variables locales du construteur elles seront accessibles pour chaque méthode et disparaîtront lors de la disparition de l'instance.

pour ce qui est de l'occupation mémoire des méthodes je ne sais pas si le moteur js met en avant 'prototype' (partage) ou la création d'une fermeture (pas de partage) lors de la création de plusieurs instances.

après regarde toujours les liens que j'ai filé plus haut, la personne qui a écrit le tuto en sait plus que moi.

+
06/08/2006, 19h52
CAML

oui j'avais déjà jeté un oeil, je pense que par precaution je vais eviter d'imbriquer mes fonctions dans ma classe.