Que font les appels, les applications et les liaisons en JavaScript ? Pourquoi les utiliser ?

Que font les appels, les candidatures et les liaisons ? Pourquoi devrions-nous apprendre cela ?

est généralement utilisé pour spécifier l'environnement de ceci. Avant de l'apprendre, vous rencontrez généralement ces problèmes.

var a = {
  user:"追梦子",
  fn:function(){
    console.log(this.user);
  }
}
var b = a.fn;
b(); //undefined

Nous voulons imprimer l'utilisateur dans l'objet a mais il s'imprime de manière indéfinie. Pourquoi ? Ce n'est pas grave si nous exécutons directement a.fn().

var a = {
  user:"追梦子",
  fn:function(){
    console.log(this.user);
  }
}
a.fn(); //追梦子

Vous pouvez imprimer ici car ceci indique ici la fonction a, alors pourquoi ce qui précède ne pointe-t-il pas vers a ? Si nous avons besoin de comprendre le problème de pointage, veuillez consulter la compréhension approfondie de ce pointage dans js

Bien que cette méthode puisse atteindre notre objectif, nous devons parfois enregistrer cet objet dans un autre dans une variable , vous pouvez utiliser la méthode suivante.

1. call()

var a = {
  user:"追梦子",
  fn:function(){
    console.log(this.user); //追梦子
  }
}
var b = a.fn;
b.call(a);

en appelant la méthode , ajoutez l'environnement auquel b doit être ajouté au premier paramètre. En termes simples, cela pointera vers cet objet.
En plus du premier paramètre, la méthode d'appel peut également ajouter plusieurs paramètres, comme suit :

var a = {
  user:"追梦子",
  fn:function(e,ee){
    console.log(this.user); //追梦子
    console.log(e+ee); //3
  }
}
var b = a.fn;
b.call(a,1,2);

2. )

La méthode apply est quelque peu similaire à la méthode call Elle peut également changer le pointage de ceci

var a = {
  user:"追梦子",
  fn:function(){
    console.log(this.user); //追梦子
  }
}
var b = a.fn;
b.apply(a);

La même chose s'applique. Il peut y avoir plusieurs paramètres, mais la différence est que le deuxième paramètre doit être un tableau, comme suit :

var a = {
  user:"追梦子",
  fn:function(e,ee){
    console.log(this.user); //追梦子
    console.log(e+ee); //11
  }
}
var b = a.fn;
b.apply(a,[10,1]);

ou

var a = {
  user:"追梦子",
  fn:function(e,ee){
    console.log(this.user); //追梦子
    console.log(e+ee); //520
  }
}
var b = a.fn;
var arr = [500,20];
b.apply(a,arr);


//注意如果call和apply的第一个参数写的是null，那么this指向的是window对象

var a = {
  user:"追梦子",
  fn:function(){
    console.log(this); //Window {external: Object, chrome: Object, document: document, a: Object, speechSynthesis: SpeechSynthesis…}
  }
}
var b = a.fn;
b.apply(null);

3. bind()

Méthode bind et Les méthodes call et apply sont quelque peu différentes, mais dans tous les cas, elles peuvent être utilisées pour changer le pointeur de ceci.

Parlons d’abord de leurs différences.

var a = {
  user:"追梦子",
  fn:function(){
    console.log(this.user);
  }
}
var b = a.fn;
b.bind(a);

Nous avons constaté que le code n'était pas imprimé. Oui, c'est la différence entre les méthodes bind et call et apply. En fait, la méthode bind renvoie une méthode modifiée. fonction .

var a = {
  user:"追梦子",
  fn:function(){
    console.log(this.user);
  }
}
var b = a.fn;
var c = b.bind(a);
console.log(c); //function() { [native code] }

Exécutons maintenant la fonction c pour voir si nous pouvons imprimer l'utilisateur dans l'objet a

var a = {
  user:"追梦子",
  fn:function(){
    console.log(this.user); //追梦子
  }
}
var b = a.fn;
var c = b.bind(a);
c();

ok, de la même manière, bind peut également avoir plusieurs paramètres, et les paramètres peuvent être à nouveau ajoutés lors de l'exécution, mais il convient de noter que les paramètres sont dans l'ordre des paramètres formels.

var a = {
  user:"追梦子",
  fn:function(e,d,f){
    console.log(this.user); //追梦子
    console.log(e,d,f); //10 1 2
  }
}
var b = a.fn;
var c = b.bind(a,10);
c(1,2);

Résumé : appelez et appliquez à la fois, modifiez ceci dans le contexte et exécutez la fonction immédiatement. La méthode bind permet à la fonction correspondante d'y accéder. est appelé lorsqu'il est appelé, et des paramètres peuvent être ajoutés lors de l'exécution. C'est leur différence. Vous pouvez choisir de l'utiliser en fonction de votre situation réelle.

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!