Maison >interface Web >js tutoriel >Comment le mot-clé JavaScript « this » se comporte-t-il dans différents contextes d'invocation de fonction ?

Comment le mot-clé JavaScript « this » se comporte-t-il dans différents contextes d'invocation de fonction ?

Barbara Streisand
Barbara Streisandoriginal
2024-12-14 15:16:14446parcourir

How Does the JavaScript `this` Keyword Behave in Different Function Invocation Contexts?

Dévoilement de la dynamique du mot-clé "this" dans les fonctions

Dans le domaine de JavaScript, le mot-clé "this" revêt une importance significative lors du traitement avec des fonctions. Sa valeur dépend du modèle d'appel utilisé.

Modèles d'appel

Les fonctions JavaScript peuvent être invoquées de quatre manières distinctes :

  1. En tant que méthode :
    Lorsqu'une fonction est invoquée en tant que méthode d'un objet, « ceci » fait référence à l'objet lui-même. Exemple :

    const foo = {
      bar() {
        console.log(this); // Logs "foo"
      }
    };
    foo.bar();
  2. En tant que fonction :
    Lorsqu'une fonction est invoquée en tant qu'entité autonome, "this" est par défaut l'objet global (généralement "fenêtre" dans les navigateurs). Exemple :

    function bar() {
      console.log(this); // Logs "Window" (global object)
    }
    bar();
  3. En tant que constructeur (avec le mot-clé "new") :
    Lorsqu'une fonction est invoquée avec le mot-clé "new", un un nouvel objet est créé et « ceci » fait référence à cet objet. Exemple :

    function Constructor() {
      this.property = "value";
    }
    const instance = new Constructor();
    console.log(instance.property); // Logs "value"
  4. Avec la méthode "apply" :
    La méthode "apply" permet de personnaliser la valeur "this" en passant un objet. Exemple :

    function bar(a, b) {
      console.log(this); // Logs "obj"
      console.log(a); // Logs "1"
      console.log(b); // Logs "2"
    }
    const obj = {
      a: 1,
      b: 2
    };
    bar.apply(obj);

Implications pour les fonctions imbriquées et les rappels

Dans les fonctions imbriquées et les rappels, le modèle d'invocation de la fonction parent détermine le valeur de "this" dans la fonction imbriquée. Si la fonction parent est invoquée en tant que méthode, « this » fait référence à l'objet ; s'il est invoqué en tant que fonction, il fait référence à l'objet global. Pour conserver la valeur souhaitée de « this » dans les rappels, des techniques telles que des fonctions de liaison ou l'utilisation de fonctions fléchées sont utilisées.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn