Discussion :

[InStep]

Bonjour, j'ai un problème avec les events d'input au sein d'une classe. J'ai cru comprendre que ça créé une sorte pseudo-clone de la classe, mais comment modifier une variable de la classe à partir d'une fonction de cet event?
(je sais pas si c'est bien clair ce que je dis )

Enfin, un exemple vaut mieux qu'un long discourt.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
this.var = "canard";
this.init = function(){
   self = this;
   document.onkeydown = function(event){self.keyDown(event);}
   setInterval(console.log(this.var),1000)
}
 
this.keyDown = function(event){
 
   this.var = "cochon";
   alert(this.var);
 
}

Ici la variable devient cochon uniquement dans la fonction appelé par le keyDown, comment la modifier "en dehors"?

Merci.

[Kaamo]

Évite de nommer tes noms de propriétés d'objets par des mots clés réservés du langage (var ici).
En faisant ça, l'objet global window va contenir une nouvelle propriété appelée var. Ok, c'est autorisé. Mais comment fais - tu pour l'utiliser, en tant que globale (vu que c'est l'idée dans ton code, sans sans passer par this (sous-entedu window)) ?

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
// PAS OK !!
this.var = 5; // sous entendu window.var
console.log(this.var); // 5
console.log(window.var); // 5
console.log(var); // erreur

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
// OKK !!
this.foo = 5; // sous entendu window.foo
console.log(this.foo); // 5
console.log(window.foo); // 5
console.log(foo); // 5

Ceci dit, l'utilisation des globales n'est pas conseillée pour des soucis, entre autres, de collisions avec tes autres script JS (qu'ils soient créés par toi ou non). Pour ça, tu peux utiliser, par exemple, le module pattern qui a pour but de créer une sorte de namespace dont tu définis quelles méthodes, quelles variables sont utilisables dans le scope principal.

Petite mise en appli :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

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
var monNameSpace = (function () {
  var maVarPrivee, keyDown;
 
  // Var Privée
  maVarPrivee = "canard";
 
  // Fonction Privée qui log maVarPrivee
  keyDown = function(){
    console.log(maVarPrivee);
  };
 
  // Retourne un objet ouvert au public qui est le seul à utiliser ses privées
  return {
    // Fonction Publique qui permet de changer la valeur de maVarPrivee
    setMaVarPrivee: function(foo){
      maVarPrivee = foo;
    },
 
    // Fonction Publique 
    init: function() {
      document.onkeydown = function(){keyDown();}
    }
  };
 
})();
 
monNameSpace.init(); // log "canard" au keydown

Puis :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

monNameSpace.setMaVarPrivee("cochon"); // on change la valeur. Au keydown, cochon sera bien affiché

Ainsi, le véritable avantage est que tu ne peux pas accéder directement à tes variables et méthodes privées sans passer par l'objet monNameSpace retourné.

[InStep]

Ça marche merci de ta réponse.