"Si un ouvrier veut bien faire son travail, il doit d'abord affûter ses outils." - Confucius, "Les Entretiens de Confucius. Lu Linggong"
Page de garde > La programmation > Pourquoi \'this\' ne fait-il pas référence à la fonction d'appel dans les rappels JavaScript ?

Pourquoi \'this\' ne fait-il pas référence à la fonction d'appel dans les rappels JavaScript ?

Publié le 2024-11-24
Parcourir:702

Why Doesn\'t \'this\' Refer to the Calling Function in JavaScript Callbacks?

Quand ceci argumente : Comprendre « ceci » dans les fonctions de rappel

En JavaScript, la valeur de this dans un appel de fonction est déterminée par le contexte dans lequel la fonction est exécutée. Cependant, lorsque vous passez ceci en argument, les règles peuvent devenir compliquées.

Plus précisément, le scénario suivant se produit : lorsqu'une fonction de rappel est passée en argument, pourquoi n'est-elle pas définie sur la fonction qui appelle le rappel ?

Comprendre la hiérarchie de « ceci »

Pour comprendre pourquoi ceci est défini là où il se trouve, nous devons considérer la hiérarchie de appels de fonction :

  • obj.prepareRandomFunction() définit ceci sur obj (règle n°2 de la réponse).
  • randomFunction(this.sumData.bind(this)) transmet ceci. sumData.bind(this) comme argument (règle n°1).
  • Dans randomFunction, callback(data) définit ceci sur l'objet global (règle #1).

Cependant, avant que randomFunction n'appelle le rappel, il utilise this.sumData.bind(this) pour créer une nouvelle fonction (règle n°5). Cette nouvelle fonction appelle la fonction de rappel d'origine, mais maintenant avec celle-ci liée à obj (l'argument passé à bind).

Implications pour les fonctions de rappel

Lors du passage d'une méthode en guise de rappel, il est crucial de comprendre qu'il ne sera pas appelé obj.method(). Cela signifie que this n'aura pas la valeur correcte dans la fonction de rappel. Pour contourner ce problème, vous pouvez utiliser bind() pour définir la valeur de this dans le rappel.

Autres notes utiles

  • Règle n°6 dans la réponse décrit comment les fonctions fléchées ES6 conservent la valeur lexicale actuelle de celle-ci, même dans les fonctions de rappel.
  • .apply() et .call() peuvent être utilisés pour créer de nouveaux appels de fonction avec des valeurs spécifiques de this.
  • bind() peut être utilisé pour créer de nouvelles fonctions qui appellent la fonction d'origine avec une valeur personnalisée de this.
  • Comprendre la nature complexe de ceci est essentiel pour un codage JavaScript efficace et pour maîtriser des concepts comme les rappels.
Dernier tutoriel Plus>

Clause de non-responsabilité: Toutes les ressources fournies proviennent en partie d'Internet. En cas de violation de vos droits d'auteur ou d'autres droits et intérêts, veuillez expliquer les raisons détaillées et fournir une preuve du droit d'auteur ou des droits et intérêts, puis l'envoyer à l'adresse e-mail : [email protected]. Nous nous en occuperons pour vous dans les plus brefs délais.

Copyright© 2022 湘ICP备2022001581号-3