你不知道的JS系列 ( 26 ) - this 和箭头函数

this 的四条绑定规则包含所有正常的函数。ES6 中箭头函数是一种无法使用这四条规则的特殊函数类型,他是根据外层作用域来决定 this 。箭头函数不是使用 function 关键字定义,而是使用 =>

 

我们看看箭头函数的词法作用域
function foo(){
  return (a) => {
    console.log(this.a) // 箭头函数下的 this
  }
}
var obj1 = {
  a: 2
}
var obj2 = {
  a: 3
}
var bar = foo.call(obj1);
bar.call(obj2); // 2

foo 的 this 绑定到 obj1,bar 的 this 也会绑定到 obj1,箭头函数的绑定无法被修改。

 

箭头函数最常用于回调函数中,例如事件处理器或者定时器
function foo(){
  setTimeout(()=>{
    // 这里的 this 在词法上继承自 foo()
    console.log(this.a)
  })
}
var obj = {
  a: 2
}
foo.call(obj); //2

 

 

posted @ 2020-03-11 06:28  wzndkj  阅读(168)  评论(0编辑  收藏  举报