Beispiel-Tutorial dazu und Objektprototyp in JavaScript

this und Objektprototyp

this ist ein ganz besonderes Schlüsselwort, das automatisch im Umfang aller Funktionen definiert wird

// foo .count ist 0, die wörtliche Interpretation ist falsch

function foo(num) {

console .log( "foo:"+ num);

this.count++;

}

foo.count = 0;

var i;

for(i=0;i<10;i++){

if(i>5){

foo(i)

}

}

console.log(foo.count) //0

　　　　

// Verwenden Sie den lexikalischen Bereich, um das Problem zu lösen

function foo(num) {

console.log("foo:"+ num);

data.count++;

}

var data = {

count:0

};

var i;

for(i=0;i<10;i++){

if(i>5){

foo(i)

}

}

console.log(data.count ); // 4

// Verwenden Sie den Bezeichner foo anstelle von this, um auf die Funktionsobjekte , vermeiden Sie das Problem dieses und verlassen Sie sich vollständig auf den lexikalischen Geltungsbereich der Variablen foo .

function foo(num) {

console.log("foo:"+ num);

foo.count++;

}

foo.count = 0

var i;

for(i=0;i<10;i++){

if(i>5 ){

foo(i)

}

}

console.log(foo.count) //4

// Zwingt dieses dazu, auf das fooFunktionsobjekt function foo(num) {

console.log("foo:"+num);

this.count++

}

foo.count = 0;

var i;

for(i=0; i< 10; i++){

if(i>5){

foo.call(foo,i);

}

}

console.log(foo.count) //4

dieses ist zur Laufzeit gebunden, nicht zum Zeitpunkt des Schreibens. Der Kontext hängt von den verschiedenen Bedingungen ab wann die Funktion aufgerufen wird. Die Bindungssumme von diesem hat nichts mit der Position der Funktionsdeklaration zu tun, sondern hängt nur von der Art und Weise ab, wie die Funktion aufruft .

dieseUmfassende Analyse

Aufrufstapel und Aufrufort

Funktion baz(){

//Der aktuelle Aufrufstapel ist: baz

// Daher ist die aktuelle Aufrufposition der globale Bereich

console.log("baz");

bar(); // <--Der Aufrufort von bar

}

>function bar(){

//Der aktuelle Aufrufstapel ist: baz-> bar

// Daher ist die aktuelle Aufrufposition bei baz

console.log("bar);

foo(); // <-- call of foo Position

}

function foo(){

//Der aktuelle Aufrufstapel ist: baz-> bar->foo

// Daher liegt die aktuelle Aufrufposition bei bar

console.log( "foo");

}

baz(); // <-- wobei baz heißt

Nur ​​bei Ausführung im nichtstrikten Modus kann die Standardbindung nur auf der obersten oder letzten Ebene im

Objektattribut-Referenzkette. Eine graue Ebene beeinflusst die aufrufende Position

function foo() {

console.log(this.a);

}

var. obj2 = {

a: 42,

foo:foo

};

var obj1 = {

a:2,

obj2: obj2

};

obj1.obj2.foo(); // 42

Typische Anwendungsszenarien der harten Bindung. Erstellen Sie einfach eine Wrapper-Funktion, übergeben Sie alle Funktionen und geben Sie alle empfangenen Werte zurück

Funktion foo(something){

console.log(this.a,something). );

return this.a + Something;

};

var obj = {

a:2

};

var bar = function() {

return foo.apply(obj,arguments);

};

var b = bar(3) ; // 2 3

console.log(b) // 5

Eine andere Möglichkeit besteht darin, eine iHilfsfunktionen zu erstellen, die wiederverwendet werden kann

Funktion foo(something){

console.log(this. a, etwas);

Gib this.a + etwas zurück;

}

//

Einfache Hilfsbindungsfunktion

Funktion bind(fn,obj){

return function(){

return fn.apply(obj,arguments);

};

}

var obj = {

a:2

}

var bar = bind(foo,obj);

var b = bar(3); // 2 3

console.log(b) // 5

ES5 bietet integrierte Methoden Function.prototype.bind, bind(..) gibt ein A zurück fest codierte neue Funktion, die

das Argument auf den Kontext von diesem setzt und die ursprüngliche Funktion aufruft.

function foo(something){

console.log(this.a, Something);

return this.a + Something;

}

var obj = {

a:2

}

var bar = foo.bind(obj);

var b = bar(3); // 3 5

console.log(b) // 5

API Kontext des Aufrufs

function foo(el){

console.log(el,this.id);

}

var obj = {

id: „awesome“

}

// Wenn Sie foo(..) aufrufen, geben Sie dieses ist gebunden an obj

[1,2,3].forEach(foo,obj);

// 1 großartig 2 großartig 3 großartig

neu

kann das Bindungsverhalten dieser Funktion foo beeinflussen. a = a; }

var bar = new foo(2);

console.log(bar. a); // 2

Beurteilen

dies

1.

Ob die Funktion in

neu

aufgerufen wird (

neu Bindung)? Die Funktion übergibt call, apply (show binding) oder hard binding call? Wenn ja, geben Sie das Objekt von beim Binden

va bar = foo.call(obj2)

3.

Ob die Funktion in einem Kontextobjekt aufgerufen wird(Implizite Bindung ) ? Wenn ja, in welchem ​​Kontext ist dieses gebunden? var bar = obj1.foo()

4.

Wenn nicht, verwenden Sie die Standardbindung. Im strikten Modus ist es an

undefiniert gebunden, andernfalls an das globale Objekt. var bar = foo();soft bindingfunction foo(){console ("name:" + this.name);

}

var obj = {name: "obj"},

obj2 = {name: "obj2" } ,obj3 = {Name: "obj3"},obj3 = {Name: "obj3"};

var foo0BJ = foo.softBind(obj);

foo0BJ(); // name:obj

obj2.foo = foo.softBind(obj);

obj2.foo(); // name:obj3 <--Schau!

setTimeout(obj2.foo,10);

// name:obj <--- Soft-Bindung angewendet

Das obige ist der detaillierte Inhalt vonBeispiel-Tutorial dazu und Objektprototyp in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!