以下代码输出什么?解释原因。

var name = 'window'
var obj = {
  name: 'obj',
  fn1: function () { console.log(this.name) },
  fn2: () => console.log(this.name),
  fn3: function () {
    return function () { console.log(this.name) }
  },
  fn4: function () {
    return () => console.log(this.name)
  }
}

obj.fn1()        // 'obj'
obj.fn2()        // 'window'
obj.fn1()()      // ❌ fn1 不返回函数,这里报错
var f3 = obj.fn3()
f3()             // 'window'
var f4 = obj.fn4()
f4()             // 'obj'

逐行分析

obj.fn1() → 'obj'
普通函数,隐式绑定,this → obj

obj.fn2() → 'window'
箭头函数没有自己的 this,继承外层作用域(全局),this → window

obj.fn3()() → 先 var f3 = obj.fn3(),f3() → 'window'
fn3 返回一个普通函数,赋值给 f3 后独立调用,默认绑定 this → window

obj.fn4()() → 先 var f4 = obj.fn4(),f4() → 'obj'
fn4 返回箭头函数,箭头函数的 this 继承 fn4 的 this。fn4 通过 obj.fn4() 调用,this → obj,所以箭头函数的 this → obj

核心规律

同分类其他题目