南順網絡

ES6 箭頭函數中 this 值的探究

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

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

可以看出，箭頭函數是直接使用的作用域內的this，apply等方法是無效的。為了加深理解，我們再來看下面一段代碼：

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}

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

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

編輯:--彭新洪