南順網絡

ES6 箭頭函數中 this 值的(de)探究

箭頭函數本身不具有this，它會直接綁定到它的(de)詞法作用域內(nèi)的(de)this，也就是定義它時的(de)作用域內(nèi)的(de)this值。所以試圖使用apply,call等方法修改箭頭函數的(de)this是不會成功的(de)，因為(wèi)箭頭函數自(zì)身沒有this。所以我們來看下面一(yī)段代碼：

var func = () => {    console.log(this); } func(); // Window func.apply({}); // Window

可(kě)以看出，箭頭函數是直接使用的(de)作用域內(nèi)的(de)this，apply等方法是無效的(de)。為(wèi)了加深理(lǐ)解，我們再來看下面一(yī)段代碼：

function func() {    console.log(this)    return () => {console.log(this)} }; func()() // Window // Window func.apply({a:1})() // Object {a:1} // Object {a:1} func.apply({a:2})() // Object {a:2} // Object {a:2}

通過這段代碼，我們應該可(kě)以明确的(de)看出來，箭頭函數是直接使用的(de)它詞法作用域內(nèi)的(de)this，也就是定義它時的(de)作用域內(nèi)的(de)this。當我們修改它的(de)作用域內(nèi)的(de)this值，也就是func的(de)this值時，在箭頭函數內(nèi)也可(kě)以反映出來。用作對比，我們看下使用function定義的(de)函數：

function func() {    console.log(this)    return function(){        console.log(this)    } }; func()() func.apply({a:1})() func.apply({a:2})()

編輯:--彭新洪