Relier cette option à ES6 => opérateur de fonction

Après avoir expérimenté des contextes héréditaires avec la fonctionnalité => que ES6 nous a donnée, j'ai remarqué que ce contexte ne peut jamais être modifié. Exemple:

var otherContext = { a: 2 }; function foo() { this.a = 1; this.bar = () => this.a; } var instance = new foo; instance.bar(); // returns 1 instance.bar.bind(otherContext)(); // returns 1 

Sans l'opérateur => et en utilisant le mot-clé de la fonction:

 function foo() { this.a = 1; this.bar = function () { return this.a; } } var instance = new foo; instance.bar(); // returns 1 instance.bar.bind(otherContext)(); // returns 2 

Par conséquent, si nous recevons une fonction à partir d'un appel externe ou simplement avons une fonction dans une variable, comment pouvons-nous être sûrs si nous pourrions lier une autre chose à cela ou s'il héritera de quelque part?

Il semble dangereux que javascript ne vous dise rien, on pourrait tomber pour un bug très subtil et difficile.

C'est effectivement juste une nouvelle syntaxe pour bind , donc cela n'introduit rien de nouveau dans la manière de trouver.

 var otherContext = { a: 2 }; function foo() { this.a = 1; this.bar = function () { return this.a }.bind(this); } var instance = new foo; log(instance.bar()); // returns 1 log(instance.bar.bind(otherContext)()); // returns 1 function log(value) { document.body.appendChild( document.createTextNode(value) ); } 

Lorsque vous utilisez le mot-clé de la function , les règles qui lient this sont assez simples.

Soit l'appel d'appel définit this (que this soit par l'intermédiaire de .apply , .apply ou JavaScript pour le définir lorsque la fonction est appelée comme méthode) ou this obtient une valeur bien connue:

  • En mode normal, this sera l'objet fenêtre.
  • En mode strict, this sera indéfini.

Avec les fonctions de flèches, la règle est encore plus simple.

  • Il n'y a pas this mot this clé. (Ni arguments, ni quelques autres)

Cela signifie que, dans une fonction de flèche, this est toujours lié au contexte extérieur, car c'est d'où this vient.

Donc, en résumé:

Lorsque vous utilisez des fonctions de flèches, la valeur de this provient toujours du contexte externe.