Introduction détaillée aux appels de méthode en JavaScript

Cet article présente principalement l'introduction détaillée de l'appel de méthode en JavaScript. En JavaScript, si une fonction appartient à un objet, l'acte d'accéder à la fonction via l'objet est appelé « appel de méthode ». Les amis dans le besoin peuvent s'y référer. .

En JavaScript, si une fonction appartient à un objet, l'acte d'accéder à la fonction via l'objet est appelé « appel de méthode ». Contrairement aux appels de fonction ordinaires, lors d'un appel de méthode, la référence this dans la fonction changera - cela fera référence à l'objet utilisé pour appeler la fonction (l'objet deviendra le contexte d'invocation de l'appel de méthode) :

var x = 99;
var sample = {
  x:1,
  act:function(a){
    this.x = a*a;//assign value to sample's x, not global object's x.
  }
}
sample.act(6);
console.log(sample.x);//36
console.log(x);//9

De la même manière que pour accéder aux propriétés des objets, en plus d'utiliser l'opérateur point, JavaScript peut également utiliser l'opérateur crochet pour effectuer des appels de méthode :

//other ways to invoke method
sample["act"](7);
console.log(sample.x);//4

Pour les fonctions en JavaScript, un comportement plus intéressant est que les fonctions (fermetures) peuvent être intégrées dans des fonctions. Lors d'un appel de méthode, s'il y a une fonction intégrée dans la fonction méthode, alors le code dans la fonction intégrée peut accéder à la valeur de la variable externe :

//nested function can access variable outside of it.
var y = 88;
var sample2 = {
  y:1,
  act2:function(a){
    this.y = inner();
    function inner(){
      return a*a;
    }
  }
}
sample2.act2(8);
console.log(sample2.y);//64
console.log(y);//88

Cependant, contrairement à l'intuition, la fonction intégrée La le code in ne peut pas en hériter de l'extérieur ; c'est-à-dire que dans la fonction embarquée, cela ne fait pas référence à l'objet qui appelle la méthode, mais à l'objet global :

//nested function does not inherit "this". The "this" in nested function is global object
var sample3 = {
  act3:function(){
    inner();
    function inner(){
      console.log(this);//window object
    }
  }
}
sample3.act3();

Si vous en avez vraiment besoin intégrer la fonction Pour accéder à l'objet appelant la méthode, vous pouvez enregistrer cette valeur dans une variable dans la fonction externe :

//pass "this" to nested function
var sample4 = {
  act4:function(){
    var self = this;
    inner();
    function inner(){
        console.log(self);//Object {act4=function()}
    }
  }
}
sample4.act4();

Ce qui précède est l'intégralité du contenu de ce chapitre. Pour plus de didacticiels connexes, veuillez visiter. Tutoriel vidéo JavaScript !