JavaScript闭包为何保留this指向？解构后为何丢失？

核心原因：this的指向由调用方式决定 #

JavaScript里函数的this完全看调用它的方式，和函数定义在哪里、被赋值给哪个变量无关，这是你困惑的关键。

第一个示例：ctx.baz()

这里是对象属性调用：baz作为ctx对象的属性，通过ctx.baz()的形式调用时，函数内部的this会自动绑定到ctx对象。
（如果你的运行结果显示this指向原obj，说明代码里的ctx本身就是obj——可能是变量命名混淆导致的，但核心逻辑不变：只要是对象.方法()的调用形式，this就指向该对象）

第二个示例：baz()

这里是独立函数调用：baz是从对象里解构出来的独立函数引用，直接调用baz()时，非严格模式下this会指向全局对象window（严格模式下是undefined）。
本质上和下面的代码效果一致：

const baz = obj.foo;
baz(); // 独立调用，this指向window

是否需要改用call或bind更稳妥？ #

看你的需求场景：

• 如果希望baz函数的this固定指向原对象obj，无论后续怎么调用都不改变，那用bind提前绑定是最稳妥的方案：

  // 在obj的bar方法中修改context的定义
  const context = { ctx: this, baz: this.foo.bind(this) };
  

  这样不管是ctx.baz()还是解构后单独调用baz()，this都会牢牢绑定到obj。
• 如果你的逻辑本来就依赖「调用时的上下文对象」（比如第一个示例需要this指向ctx），那保持当前对象.方法()的调用方式就没问题，不需要额外修改。
• 如果是严格模式开发，独立调用函数时this会变成undefined，此时若不想丢失上下文，就必须用call/bind/apply手动指定this。

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