为何将对象方法赋值给自身后调用时this为undefined？

先看完整代码：

"use strict";

function foo() {
  return this;
}

let bar = {
  foo,
  baz() {
    return this;
  }
};

console.log( foo() ); // undefined (or globalThis outside strict mode)

console.log( bar.foo() ); // bar
console.log( (bar.foo)() ); // bar

console.log( (bar.foo = bar.foo)() ); // undefined (or globalThis outside strict mode)

核心原因：赋值表达式返回未绑定对象的原始函数 #

要搞懂这行代码的结果，得拆成两步分析：

• 第一步：赋值表达式的返回值
  bar.foo = bar.foo这个操作，本质是把bar.foo对应的原始foo函数，重新赋值给bar.foo属性。赋值表达式的返回值就是右侧的函数本身——也就是脱离了bar对象绑定的原始foo函数，不是和bar关联的方法。
• 第二步：调用返回的函数
  直接调用这个返回的函数时，属于普通函数调用（没有通过对象.方法的形式触发调用）。在严格模式下，普通函数调用的this就是undefined；非严格模式下会自动绑定到全局对象globalThis。

对比其他调用方式 #

• bar.foo()：通过对象调用方法，this自动绑定到调用它的bar对象。
• (bar.foo)()：括号只是语法上的分组操作，没有改变函数的调用方式，本质还是通过bar调用方法，所以this依然指向bar。

内容的提问来源于stack exchange，提问作者Aladdin Mhemed