JS中的this可以简单理解为:谁调用我,this就是谁。
ES6箭头函数的this略微不同:this指向离该箭头函数最近的父级声明式函数,即:ES5:function func(){...} 或 ES6:func(){...}
。
异步函数中的声明式函数想要提升 this的指向,可以对函数进行this绑定。
做法是直接在函数的花括号后面添加bind(this)
。
1、箭头函数的this
下面例子中的函数bb
,setTimeout
箭头函数里的this实际上是函数bb
的this,而它是指向对象a
的,因此不需要bind
就能直接调用aa
方法。
2、this绑定
下面例子中的函数cc
,我们在setTimeout
中为匿名函数添加了bind(this)
,此时这个this
是函数cc
的this
,而这个this
实际上是指向对象a
的,因此就可以在匿名函数中调用aa
方法了。
/**
* 用 setTimeout模拟异步函数中的this的问题。
*/
const a = {
aa(){
console.log(111);
},
bb(){
setTimeout(() => {
this.aa();
}, 1000);
},
cc(){
/**
* 声明式函数需要进行this绑定,直接跟在函数的花括号后即可。
*/
setTimeout(function(){
this.aa();
}.bind(this), 1000);
}
}
// a.bb();
a.cc();