默認(rèn)綁定
JS中最常用的函數(shù)調(diào)用類型：獨(dú)立函數(shù)調(diào)用?？蓪⑵淇醋鳠o法應(yīng)用其他規(guī)則時(shí)的默認(rèn)規(guī)則。
function foo() {
console.log(this.a);
}
var a = 2;
foo(); // 2
- 聲明在全局作用域中的變量就是全局對象的一個(gè)同名屬性。
- 如果使用了嚴(yán)格模式，則不能將全局對象應(yīng)用于默認(rèn)綁定。如下：
function foo() {
'use strict';
console.log(this.a);
}
var a = 2;
foo(); // TypeError: this is undefined
隱式綁定
當(dāng)函數(shù)引用有上下文對象時(shí)，隱式綁定規(guī)則會(huì)把函數(shù)中的this綁定到這個(gè)上下文對象。
function foo() {
console.log(this.a);
}
var obj2 = {
a: 42,
foo: foo
};
var obj1 = {
a: 2,
obj2: obj2
}
obj1.obj2.foo(); // 42
- 無論是直接在
obj2中定義還是先定義再添加為引用屬性，這個(gè)函數(shù)嚴(yán)格來說都不屬于obj2對象。 - 對象屬性引用鏈中只有上一層或者說最后一層在調(diào)用位置中起作用。
隱式丟失
一個(gè)常見的this綁定問題就是被隱式綁定的函數(shù)會(huì)丟失綁定對象，從而應(yīng)用默認(rèn)綁定。
function foo() {
console.log(this.a);
}
var obj = {
a: 2,
foo: foo
};
var bar = obj.foo;
var a = 'global a';
bar(); // global a
雖然bar是obj.foo的一個(gè)引用，但實(shí)際上它引用的是foo函數(shù)本身，因此此時(shí)的bar()其實(shí)是一個(gè)不帶任何修飾的函數(shù)調(diào)用，從而應(yīng)用了默認(rèn)綁定。
顯式綁定
可以直接指定this的綁定對象，因此稱之為顯式綁定。
call(...) / apply(...)
function foo() {
console.log(this.a);
}
var obj = {
a: 2
};
foo.call(obj); / /2
- 通過
foo.call(...)，我們可以在調(diào)用foo時(shí)強(qiáng)制把它的this綁定到obj上。 - 如果傳入一個(gè)原始值（如數(shù)字、字符串）當(dāng)作
this綁定的對象，這個(gè)原始值會(huì)被轉(zhuǎn)換成它的對象形式（即new String(...),new Number(...)等）。這通常被稱為“裝箱”。 - 至此，顯式綁定仍無法解決丟失綁定的問題。
硬綁定
硬綁定是顯式綁定的一個(gè)變種，可以解決綁定丟失。
unction foo() {
console.log(this.a);
}
var obj = {
a: 2
}
var bar = function() {
foo.call(obj);
};
bar(); // 2
setTimeout(bar, 100); // 2
// 硬綁定的bar不可能再修改它的this
bar.call(window); // 2
- 在函數(shù)
bar中，我們將foo的this強(qiáng)制綁定到了obj上，無論之后如何調(diào)用bar，總會(huì)手動(dòng)在obj上調(diào)用foo，無法再改變它的this。 - 這種綁定是一種顯式的強(qiáng)制綁定，因此稱為硬綁定。
-
bind()是ES5提供的實(shí)現(xiàn)硬綁定的內(nèi)置方法。 - 許多API或內(nèi)置函數(shù)都有一個(gè)可選參數(shù)
context，其作用和bind一樣，都是確保你的回調(diào)函數(shù)使用指定的this。
new綁定
在JS中，構(gòu)造函數(shù)只是一些使用new操作符時(shí)被調(diào)用的函數(shù)。它們并不屬于某個(gè)類，也不會(huì)實(shí)例化一個(gè)類。只是被new操作符調(diào)用的普通函數(shù)。
function foo (a) {
this.a = a;
}
var bar = new foo(2);
console.log(bar.a); // 2
console.log(bar); // foo {a: 2}
使用new調(diào)用foo時(shí)，會(huì)構(gòu)造一個(gè)新對象并把它綁定到foo調(diào)用中的this上。new是最后一種可以影響函數(shù)調(diào)用時(shí)this綁定行為的方法，我們稱之為new綁定。
Tips
使用new調(diào)用函數(shù)時(shí)，會(huì)自動(dòng)執(zhí)行如下操作：
- 創(chuàng)建（或者說構(gòu)造）一個(gè)全新的對象
- 這個(gè)新對象會(huì)被執(zhí)行
[[Prototype]]連接 - 這個(gè)新對象會(huì)綁定到函數(shù)調(diào)用的
this - 如果函數(shù)沒有返回其他對象，那么
new表達(dá)式中的函數(shù)調(diào)用會(huì)自動(dòng)返回這個(gè)新對象
