1酬荞、默認綁定
當一個函數(shù)沒有明確的調(diào)用對象的時候,也就是單純作為獨立函數(shù)調(diào)用的時候瞧哟,將對函數(shù)的this使用默認綁定:綁定到全局的window對象
function a () {
console.log(this)
}
a(); // 輸出window
2混巧、隱式綁定
當函數(shù)引用有上下文對象時,函數(shù)調(diào)用中的this會綁定到這個上下文對象
function foo() {
console.log(this.a)
}
let obj = {
a: 2,
foo: foo
}
obj.foo(); // 輸出2
2.1勤揩、隱式丟失
直接調(diào)用引用的函數(shù)時咧党,函數(shù)是沒有上下文對象的,隱式綁定的this丟失了
function foo() {
console.log(this.a)
}
let obj = {
a: 2,
foo: foo
}
let a = 3; // a是全局對象的屬性
let foo2 = obj.foo; // 這里foo2將引用foo函數(shù)本身陨亡,所以不帶有函數(shù)對象的上下文
foo2(); // 輸出3
3傍衡、顯示綁定
采用call()和apply(),通過傳入一個對象(若為基本類型负蠕,會被封裝函數(shù)轉為對象—裝箱)蛙埂,將this綁定到該對象
function foo() {
console.log(this.a)
}
let obj = {
a: 2,
foo: foo
}
let a = 3; // a是全局對象的屬性
let foo2 = obj.foo; // 這里foo2將引用foo函數(shù)本身,所以不帶有函數(shù)對象的上下文
foo2(); // 輸出3
foo2.call(obj); // 輸出2
foo2.apply(obj); // 輸出2
使用bind也可以將this綁定到一個對象遮糖,但是bind不執(zhí)行函數(shù)绣的,只返回一個可供執(zhí)行的函數(shù)
let b = foo2.bind(obj); // 此時返回一個可供執(zhí)行的函數(shù)
b(); // 輸出2
4、new綁定
任何函數(shù)都可能被用作構造函數(shù),當函數(shù)被new操作符“構造調(diào)用”時屡江,會執(zhí)行下面操作:
- 創(chuàng)建一個新對象(若該函數(shù)不是JS內(nèi)置的芭概,則創(chuàng)建一個新的Object對象);
- 將this綁定到這個對象惩嘉;
- 執(zhí)行構造函數(shù)中的代碼(為這個新對象添加屬性)谈山;
- 若函數(shù)沒有返回其他對象,則自動返回這個新對象宏怔;若函數(shù)有return返回的是非對象奏路,則還是自動返回這個新對象,即覆蓋那個非對象臊诊。
function foo (a) {
this.a = a;
}
var a1 = new foo (1);
var a2 = new foo (2);
console.log(a1.a); // 輸出1
console.log(a2.a); // 輸出2