1 this初步
?????this 實(shí)際上是在函數(shù)被調(diào)用時(shí)發(fā)生的綁定，它指向什么完全取決于函數(shù)在哪里被調(diào)用。
1.1 對(duì) this 的誤解
- 容易把 this 理解成指向函數(shù)自身
<script type="text/javascript">
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
</script>
? ? ? ?在上面，foo是一個(gè)函數(shù)對(duì)象，foo.count為foo添加了一個(gè)count屬性，其實(shí)是window.foo.count=0。
? ? ? ?條件語(yǔ)句、循環(huán)迭代語(yǔ)句、console.log并不會(huì)改變上下文this。因此，在for語(yǔ)句中，this指向window，調(diào)用的是window.foo(i)，foo中增加的是count是window.count，而不是window.foo.count，foo.count依然為0.
? ? ? ?解決辦法是強(qiáng)制 this 指向 foo 函數(shù)對(duì)象：
<script type="text/javascript">
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 ); // 把this指向foo
}
}
console.log(foo.count);
//4
</script>
- 第2種常見(jiàn)的誤解是，this 指向函數(shù)的作用域
? ? ? ?這個(gè)問(wèn)題有點(diǎn)復(fù)雜，因?yàn)樵谀撤N情況下它是正確的，但有時(shí)卻是錯(cuò)誤的
? ? ? ?首先，這段代碼試圖通過(guò) this.bar() 來(lái)引用 bar() 函數(shù)。這是絕對(duì)不可能成功的，我們之后會(huì)解釋原因。調(diào)用 bar() 最自然的方法是省略前面的 this，直接使用詞法引用標(biāo)識(shí)符。
? ? ? ?此外，編寫(xiě)這段代碼的開(kāi)發(fā)者還試圖使用 this 聯(lián)通 foo() 和 bar() 的詞法作用域，從而讓 bar() 可以訪問(wèn) foo() 作用域里的變量 a。這是不可能實(shí)現(xiàn)的，你不能使用 this 來(lái)引用一 個(gè)詞法作用域內(nèi)部的東西。
? ? ? ?每當(dāng)你想要把 this 和詞法作用域的查找混合使用時(shí)，一定要提醒自己，這是無(wú)法實(shí)現(xiàn)的。
1.2 this到底是什么
? ? ? ?this 是在，并不是在編寫(xiě)時(shí)綁定，它的上下文取決于函數(shù)調(diào)用時(shí)的各種條件。
? ? ? ?當(dāng)一個(gè)函數(shù)被調(diào)用時(shí)，會(huì)創(chuàng)建一個(gè)活動(dòng)記錄（有時(shí)候也稱(chēng)為執(zhí)行上下文）。這個(gè)記錄會(huì)包 含函數(shù)在哪里被調(diào)用（調(diào)用棧）、函數(shù)的調(diào)用方法、傳入的參數(shù)等信息。 就是記錄的其中一個(gè)屬性，會(huì)在函數(shù)執(zhí)行的過(guò)程中用到。
2 調(diào)用位置
? ? ? ?調(diào)用位置就是函數(shù)在代碼中（而不是聲明的位置）。只有仔細(xì)分析調(diào)用位置才能回答這個(gè)問(wèn)題：這個(gè) this 到底引 用的是什么？
? ? ? ?尋找調(diào)用位置,最重要的是要分析調(diào)用棧（就是為了到達(dá)當(dāng)前執(zhí)行位置所調(diào)用的所有函數(shù)）。
<script type="text/javascript">
function baz() {
// 當(dāng)前調(diào)用棧是：baz ----------------------------2
// 因此，當(dāng)前調(diào)用位置是全局作用域
console.log( "baz" );
bar(); // <-- bar 的調(diào)用位置
}
function bar() {
// 當(dāng)前調(diào)用棧是 baz -> bar ---------------------------- 3
// 因此，當(dāng)前調(diào)用位置在 baz 中
console.log( "bar" );
foo(); // <-- foo 的調(diào)用位置
}
function foo() {
// 當(dāng)前調(diào)用棧是 baz -> bar -> foo ----------------------------4
// 因此，當(dāng)前調(diào)用位置在 bar 中
console.log( "foo" );
}
baz(); // <-- baz 的調(diào)用位置 -----------------1 -------------5
</script>
? ? ? ?另一個(gè)查看調(diào)用棧的方法 是使用瀏覽器的調(diào)試工具。絕大多數(shù)現(xiàn)代桌面瀏覽器都內(nèi)置了開(kāi)發(fā)者工具， 其中包含 JavaScript 調(diào)試器。
? ? ? ?可以在工具中給 foo() 函數(shù)的 第一行代碼設(shè)置一個(gè)斷點(diǎn)，或者直接在第一行代碼之前插入一條 debugger; 語(yǔ)句。運(yùn)行代碼時(shí)，調(diào)試器會(huì)在那個(gè)位置暫停，同時(shí)會(huì)展示當(dāng)前位置的函數(shù)調(diào)用列表，這就是你的調(diào)用棧。因此，如果你想要分析 this 的綁定，使用開(kāi)發(fā)者工具得到調(diào)用棧，然后找到棧中第二個(gè)元素，這就是真正的調(diào)用位置。
