Pourquoi la méthode Bind() est-elle essentielle en JavaScript ?

Pourquoi JavaScript bind() est-il nécessaire ?

Problème et solution

En JavaScript, le mot-clé this fait référence à l'objet sur lequel une fonction est invoquée. Cependant, lorsqu'une fonction est affectée à une variable puis appelée indirectement, cette valeur peut être imprévisible. Cela peut entraîner des erreurs telles que « ceci n'est pas défini » ou « ceci est l'objet global ».

Pour résoudre ce problème, JavaScript fournit la méthode bind(). En appelant bind(object), vous pouvez définir explicitement la valeur this pour la fonction, même lorsqu'elle est appelée ultérieurement. Cela empêche la valeur this de changer de manière inattendue.

Pourquoi le problème se produit

Comme expliqué précédemment, la valeur this est déterminée par le contexte d'invocation. Lorsqu'une fonction est appelée directement, cette valeur est simplement l'objet sur lequel elle est invoquée. Cependant, lorsqu'une fonction est affectée à une variable, elle perd son contexte d'invocation d'origine.

Exemple 1

<code class="js">this.name = "John";

var myName = {
  name: "Tom",
  getName: function() {
    return this.name
  }
}

var storeMyName = myName.getName;</code>

Dans l'exemple 1, storeMyName est une référence à la fonction getName. Lorsque storeMyName est appelé, il perd son contexte d'origine dans l'objet myName. Par conséquent, cet intérieur storeMyName fait référence à l'objet global, pas à l'objet myName.

Solution (bind)

<code class="js">var storeMyName2 = myName.getName.bind(myName);</code>

Dans l'exemple 2, bind() est utilisé pour définir explicitement la valeur this pour getName sur l'objet myName. Cela garantit que lorsque storeMyName2 est appelé, cela fera référence à l'objet myName, et non à l'objet global.

Pourquoi l'exemple 3 résout le problème

<code class="js">var storeMyName3 = myName.getName();</code>

Exemple 3 est différent des autres car il n'attribue pas de fonction à une variable. Au lieu de cela, il appelle directement myName.getName() et stocke le résultat dans storeMyName3. Cela signifie que storeMyName3 n'est pas une fonction, mais plutôt la valeur renvoyée par la fonction getName. Par conséquent, il n'a pas à s'inquiéter de cette valeur.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!