您当前位置: 南顺网络>> 官方资讯>> 建站知识

ES6 箭头函数中 this 值的探究

箭头函数本身不具有this,它会直接绑定到它的词法作用域内的this,也就是定义它时的作用域内的this值。所以试图使用apply,call等方法修改箭头函数的this是不会成功的,因为箭头函数自身没有this。所以我们来看下面一段代码:

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

可以看出,箭头函数是直接使用的作用域内的thisapply等方法是无效的。为了加深理解,我们再来看下面一段代码:

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值,也就是functhis值时,在箭头函数内也可以反映出来。用作对比,我们看下使用function定义的函数:

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

编辑:--彭新洪