Heim > Web-Frontend > js-Tutorial > Hauptteil

Was bewirken Aufruf, Anwendung und Bindung in JavaScript? Warum sie verwenden?

伊谢尔伦
Freigeben: 2017-07-20 14:15:03
Original
1339 Leute haben es durchsucht

Was bewirken Call, Apply und Bind? Warum sollten wir das lernen?

wird im Allgemeinen verwendet, um die Umgebung zu spezifizieren. Bevor Sie es lernen, haben Sie normalerweise diese Probleme.


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

Wir möchten den Benutzer in Objekt a drucken, aber es druckt undefiniert. Warum? Es ist in Ordnung, wenn wir a.fn() direkt ausführen.


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

Sie können hier drucken, weil dies hier auf die Funktion a verweist. Warum zeigt das Obige also nicht auf a? Wenn wir das Zeigeproblem verstehen müssen, sehen Sie sich bitte das ausführliche Verständnis dieses Zeigens in js an.

Obwohl diese Methode unseren Zweck erreichen kann, müssen wir dieses Objekt manchmal in einer anderen Variable speichern können Sie die folgende Methode verwenden.

1. call()


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

durch Aufrufen der Methode , fügen Sie die Umgebung, zu der b hinzugefügt werden soll, zum ersten Parameter hinzu. Einfach ausgedrückt, zeigt dies auf dieses Objekt.
Zusätzlich zum ersten Parameter kann die Aufrufmethode auch mehrere Parameter hinzufügen, wie folgt:


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);
Nach dem Login kopieren

2. )

Die Apply-Methode ähnelt in gewisser Weise der Call-Methode. Sie kann auch die Ausrichtung ändern


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

Das Gleiche gilt. Es können mehrere Parameter vorhanden sein, der Unterschied besteht jedoch darin, dass der zweite Parameter ein Array sein muss, wie folgt:


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]);
Nach dem Login kopieren

oder


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对象
Nach dem Login kopieren


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);
Nach dem Login kopieren

3. bind()

bind-Methode und Die Aufruf- und Apply-Methoden unterscheiden sich etwas, können aber auf jeden Fall verwendet werden, um den Zeiger davon zu ändern.

Lassen Sie uns zunächst über ihre Unterschiede sprechen.


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

Wir haben festgestellt, dass der Code nicht gedruckt wurde. Ja, das ist der Unterschied zwischen den Methoden bind, call und apply. Tatsächlich gibt die Methode bind eine Änderung zurück Funktion.


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

Jetzt führen wir Funktion c aus, um zu sehen, ob wir den Benutzer in Objekt a ausdrucken können


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

OK, bind kann auch mehrere Parameter haben und die Parameter können bei der Ausführung erneut hinzugefügt werden. Es ist jedoch zu beachten, dass die Parameter in der Reihenfolge der formalen Parameter vorliegen.


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);
Nach dem Login kopieren

Zusammenfassung: Aufruf und Anwendung ändern dies im Kontext und führen die Funktion sofort aus. Die Bindungsmethode ermöglicht es, die entsprechende Funktion auszuführen wird aufgerufen, wenn es aufgerufen wird, und Parameter können während der Ausführung hinzugefügt werden. Dies ist der Unterschied, den Sie entsprechend Ihrer tatsächlichen Situation verwenden möchten.

Das obige ist der detaillierte Inhalt vonWas bewirken Aufruf, Anwendung und Bindung in JavaScript? Warum sie verwenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!