So verwenden Sie den JS-Aufrufmodus, um dieses Schlüsselwort zu binden

Dieses Mal zeige ich Ihnen, wie Sie den JS-Aufrufmodus zum Binden mit dem Schlüsselwort this verwenden. Was sind die Vorsichtsmaßnahmen für die Verwendung des JS-Aufrufmodus zum Binden mit dem Schlüsselwort this? Praktischer Fall, schauen wir uns das gemeinsam an.

Aufrufaufruf

Rufen Sie eine Funktion auf, um die Ausführung der aktuellen Funktion anzuhalten und Steuerung und Parameter an die neue Funktion zu übergeben.

Inkonsistenzen zwischen tatsächlichen und formalen Parametern führen nicht zu Laufzeitfehlern. Mehr werden ignoriert und weniger werden als undefiniert gefüllt.

Jede Methode erhält zwei zusätzliche Parameter: this und arguments. Der Wert davon hängt vom Aufrufmodus ab: Aufrufmodus: Methode, Funktion, Konstruktor und Aufrufmodus anwenden
Dem wird ein Wert zugewiesen und er tritt in dem Moment auf, in dem er aufgerufen wird. Mit der Aufrufmethode können verschiedene Aufrufmuster implementiert werden

var myObject = { 
value: 0, 
increment: function (inc) { 
this.value += typeof inc === 'number' ? inc : 1; 
} 
}; 
myObject.double = function(){ 
var helper = function(){ 
console.log(this);// this point to window 
} 
console.log(this);// this point to object myObject 
helper(); 
} 
myObject.double();//myObject Window

1 Das Methodenaufrufmuster Methodenaufrufmuster

Methode: Die Funktion wird als Attribut des Objekts gespeichert. Wenn die Methode aufgerufen wird, wird diese an das Objekt gebunden

Öffentliche Methode: Methode zum Abrufen des Kontexts des Objekts, zu dem sie gehören, über diese

myObject.increment(); 
document.writeln(myObject.value); //

zugrunde liegende Implementierung: myObject.increment。call(myObject，0);

2 Das Funktionsaufrufmuster Funktionsaufrufmuster

Wenn die Funktion kein Attribut des Objekts ist, wird sie als Funktion aufgerufen (etwas Unsinn...), Dies ist an das globale Objekt (Fenster) gebunden

In diesem Modus gibt es einen neuen strikten Modus, um Probleme so früh wie möglich aufzudecken und das Debuggen zu erleichtern. Dies ist an undefiniert gebunden

var add = function (a,b) { return a + b;}; 
var sum = add（3，4）；// sum的值为7

Zugrunde liegende Implementierung: add.call（window，3，4）

strict mode：add.call（undefined，3，4）

Der Unterschied zwischen Methodenaufrufmodus und Funktionsaufrufmodus

function hello(thing) { 
console.log(this + " says hello " + thing); 
} 
person = { name: "Brendan Eich" } 
person.hello = hello; 
person.hello("world") // [object Object] says hello world 等价于 person。hello。call（person，“world”） 
hello("world") // "[object DOMWindow]world" 等价于 hello。call（window，“world”）

3 Das Konstruktoraufrufmuster

JavaScript ist eine Sprache, die auf prototypischer Vererbung basiert und eine Reihe von Objektkonstruktionssyntaxen für klassenbasierte Sprachen bereitstellt.

dies verweist auf das von new zurückgegebene Objekt

var Quo = function (string) { 
this.status = string; 
}; 
Quo.prototype.get_status = function ( ) { 
return this.status; 
}; 
var myQuo = new Quo("this is new quo"); //new容易漏写，有更优替换 
myQuo.get_status( );// this is new quo

4 Das Apply-Aufrufmuster

Apply und Call sind beide integrierte Parameter von Javascript Davon wird diese Bindung sofort in eine Funktion geändert. Der erstere Parameter ist ein Array, der letztere muss einzeln übergeben werden. apply wird auch durch den Aufruf der untersten Ebene implementiert

apply(this,arguments[]); 
call(this,arg1,arg2...); 
var person = { 
name: "James Smith", 
hello: function(thing,thing2) { 
console.log(this.name + " says hello " + thing + thing2); 
} 
} 
person.hello.call({ name: "Jim Smith" },"world","!"); // output: "Jim Smith says hello world!" 
var args = ["world","!"]; 
person.hello.apply({ name: "Jim Smith" },args); // output: "Jim Smith says hello world!"

Im Gegensatz dazu ist die Bindungsfunktion trennt die Bindung an die Funktion und den Aufruf der Funktion, sodass Funktionen in einem bestimmten Kontext aufgerufen werden können, insbesondere die Apply-Implementierung von Event bind

Function.prototype.bind = function(ctx){ 
var fn = this; //fn是绑定的function 
return function(){ 
fn.apply(ctx, arguments); 
}; 
}; 
bind用于事件中 
function MyObject(element) { 
this.elm = element; 
element.addEventListener('click', this.onClick.bind(this), false); 
}; 
//this对象指向的是MyObject的实例 
MyObject.prototype.onClick = function(e) { 
var t=this; //do something with [t]... 
};

Ich glaube, Sie haben die Methode gemeistert, nachdem Sie den Fall in diesem Artikel gelesen haben Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

So verwenden Sie das Bildanzeige-Plug-in highslide.js in jQuery

So verwenden Angularjs benutzerdefinierte Anweisungen

Das obige ist der detaillierte Inhalt vonSo verwenden Sie den JS-Aufrufmodus, um dieses Schlüsselwort zu binden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!