this 绑定例外之间接引用

Posted 2021-02-07 lwl0812

在《你不知道的javascript》之“this全面解析”一节中，讲到了this绑定例外的间接引用，代码如下：

function foo () {
  console.log(this.a)
}

var a = 2;

var o = {
  a: 3,
  foo: foo
}

var p = {
  a: 4
}

o.foo(); // 3
(p.foo = o.foo)(); // 2

注意看最后一行，一开始很难理解，为什么打印出来的是2。

书上的解释如下：

赋值表达式 p.foo = o.foo 的返回值是目标函数的引用， 因此调用位置是 foo() 而不是p.foo() 或者 o.foo()。 根据我们之前说过的， 这里会应用默认绑定。 

估计我语文不是很好，所以读了好几遍才明白。

还是用代码来解释上面这段话的意思吧：

function foo () {
  console.log(this.a)
}

var o = {
  a: 3,
  foo: foo
}

var p = {
  a: 4
}

var = 2;

var bar = (p.foo = o.foo); // <-- 注意这里
console.log(bar); // ? foo () {console.log(this.a)} <-- 打印bar，发现执行了 (p.foo = o.foo) 后，会有一个返回值，将该返回值赋值给 bar，打印出来的是全局函数 foo
bar(); // 2 <-- 相当于执行了  (p.foo = o.foo)() ，同上面那段代码中的最后一行

所以 (p.foo = o.foo)() 就相当于执行了 foo() ，此时可应用 this 的绑定规则之一——默认绑定来确定 this 对应的对象，即全局对象，所以 this.a 就是 2。

关于 this 的绑定规则，可参看 《你不知道的JavaScript》之“this全面解析”中的绑定规则一节。