對 js 中 this 指向的理解

這是函式通常的用法，屬於全域性性的呼叫，所以this指向全域性。

var x = 1;

function test() 
test();  // 1

此時，誰呼叫這個函式，函式內部的this就指向誰

var name = 'window';

var test = 
}test.getname(); // test

this指向當前例項

var name = 'window';

function test()
}let test = new test();
test.getname(); // test

var test = 

}var testcall = 
test.getname.call(testcall,'extraparam1','extraparam2');
// testcall extraparam1 extraparam2

var test = 

}}

var test = 

}var testbind = 
let getnamebind = test.getname.bind(testbind,'前置引數');
getnamebind('extraparam1'); // testbind 前置引數 extraparam1
test.getname('extraparam1','extraparam2'); // test extraparam1 extraparam2

this.name = 'window';

var test = 
}var testcall = 
}var testbind = 
test.getname(); // window
test.getname.call(testcall); // window
test.getname.bind(testbind)(); // window

this.name = 'window';

var test = 
}}var testcall = 
}var testbind = 
test.getname()(); // test
test.getname.call(testcall)(); // testcall
test.getname.bind(testbind)()(); // testbind

var name = 'window'

var person1 = ,
show2: () => console.log(this.name),
show3: function () 
},show4: function () 
}var person2 = 
person1.show1() // person1
person1.show1.call(person2) // person2
person1.show2() // window
person1.show2.call(person2) // window
person1.show3()() // window
person1.show3().call(person2) // person2
person1.show3.call(person2)() // window
person1.show4()() // person1
person1.show4().call(person2) // person1
person1.show4.call(person2)() // person2

第 21 行：使用call將show1函式的指標指向person2

第 23 行：show2函式為箭頭函式，父級作用域為person1作用域即全域性作用域，所以this指向window

地 24 行：箭頭函式的this指向在定義時就已經確定。不隨著call進行修改，所以此處this依舊是指向window

第 26 行：show3 返回乙個函式，然後呼叫這個返回的函式，此行等價於

let show3 = person1.show3(); 

show3()

第 27 行：使用call將show3函式返回的函式的this指向了person2，等價與於

let show3 = person1.show3();

show3.call(person2);

let show3 = person1.show3.call(person2);

show3();

第 30 行：show4返回的是乙個箭頭函式，箭頭函式的this是繼承的父級函式show4的this，所以此處箭頭函式的this取決於show4的this指向，此處使用person1進行呼叫，所以shoe4的this指向person1

第 31 行：show4返回的是乙個箭頭函式，箭頭函式的this不會被call改變，依舊時取決於父級的show4函式的this，此處person1進行呼叫，所以依舊是指向的this

第 32 行：修改了show4函式的this指向，指向了person2，由於上面說的，此處箭頭函式的this是取決於show4的，所以箭頭函式的this也指向了person2。

var name = 'window'

function person (name) 
this.show2 = () => console.log(this.name)
this.show3 = function () 
}this.show4 = function () 
}var persona = new person('persona')
var personb = new person('personb')
persona.show1() // persona
persona.show1.call(personb) // personb
persona.show2() // persona
persona.show2.call(personb) // persona
persona.show3()() // window
persona.show3().call(personb) // personb
persona.show3.call(personb)() // window
persona.show4()() // persona
persona.show4().call(personb) // persona
persona.show4.call(personb)() // personb

第 22 行：建構函式例項的物件呼叫函式，函式this指向呼叫物件，所以此處是指向了persona

第 23 行：show1函式的this被call修改，指向 personb

第 25 行：show2 為乙個箭頭函式，this指向父級作用域，此處也就是建構函式內部，取決於呼叫物件，此處是persona進行呼叫，所以this指向了persona

第 26 行：箭頭函式的this指向不會被call修改，所以依舊是指向persona

第 28 行：show3 返回乙個函式，屬於全域性呼叫，this指向全域性，等價於

let show3 = persona.show3();

show3();

let show3 = persona.show3();

show3.call(personb);

let show3 = persona.show3.call(personb);

show3();

第 33 行：箭頭函式的this不會被call修改，此處依舊取決於 show4 的呼叫者，指向 persona

第 34 行：修改 show4 的this指向，而箭頭函式的this取決於show4 所以此處this指向了 personb

以上為對js中this指向的闡述。得出結論：** === 玄學

理解js中this的指向問題

在前端的飛速發展的過程中，各種框架層出不窮，但是當大家看到這些框架的原始碼時，大家也許會發現很多框架都有this 這個問題，由此看來this的指向是多麼的重要，但是關於this問題許多人對於他的指向問題一直都是很模糊，那麼就讓我們來一起看一下this的指向到底是怎麼樣的。首先必須要說的是，this的...

徹底理解js中this的指向

首先必須要說的是，this的指向在函式定義的時候是確定不了的，只有函式執行的時候才能確定this到底指向誰，實際上this的最終指向的是那個呼叫它的物件 這句話有些問題，後面會解釋為什麼會有問題，雖然網上大部分的文章都是這樣說的，雖然在很多情況下那樣去理解不會出什麼問題，但是實際上那樣理解是不準確的...

徹底理解 JS 中 this 的指向

首先必須要說的是，this的指向在函式定義的時候是確定不了的，只有函式執行的時候才能確定this到底指向誰，實際上this的最終指向的是那個呼叫它的物件 這句話有些問題，後面會解釋為什麼會有問題，雖然網上大部分的文章都是這樣說的，雖然在很多情況下那樣去理解不會出什麼問題，但是實際上那樣理解是不準確的...