請搭配 https://zhuanlan.zhihu.com/p/57204184 使用
以下內(nèi)容改編自 https://www.cnblogs.com/jeodeng/p/10658590.html
// 先給window加一個(gè)id饭玲，以便于確認(rèn)之后this的指向
window.id = 0;
// 聲明一個(gè)函數(shù)fn
const fn = {
id: 1,
say: function() {
console.log('id:', this.id);
},
// 1, fn調(diào)用say，this指向fn
sayArrow: () => {
console.log('id:', this.id);
},
// 0, 箭頭函數(shù)雖然定義在fn中喇勋，但fn不是作用域悦陋，作用域是指函數(shù)內(nèi)部遵岩，繼續(xù)往外找，到了最外層window
say1: function() {
setTimeout(function() {
console.log('id:', this.id);
}, 1000);
},
// 0, setTimeout傳入的回調(diào)方法其實(shí)是在setTimeout中執(zhí)行的，沒有其它對象調(diào)用該回調(diào)方法念搬，所以回調(diào)方法的this指向window
say2: function() {
let that = this;
setTimeout(function() {
console.log('id:', that.id);
}, 1000);
},
// 1, that指向fn尚揣，又把fn引用傳進(jìn)了setTimeout回調(diào)方法
say3: function() {
setTimeout(() => {
console.log('id:', this.id);
}, 1000);
},
/**
1, setTimeout傳入了一個(gè)匿名箭頭函數(shù)涌矢，相當(dāng)于
say3: function() {
var temp = () => {
console.log('id:', this.id);
};
setTimeout(temp, 1000);
}
箭頭函數(shù)的this指向它的作用域，箭頭函數(shù)是在say3函數(shù)中定義的快骗，say3的this指向調(diào)用它的fn
**/
say4: () => {
setTimeout(() => {
console.log('id:', this.id);
}, 1000);
},
// 0, 基于上面的解釋娜庇，say4是在fn中定義的塔次，fn是對象，不是say4的作用域名秀，所以繼續(xù)往上励负，到達(dá)window
say5: () => {
setTimeout(function() {
console.log('id:', this.id);
}, 1000);
},
};
// 0，解釋等同于 say1
