对象展开时通过方法修改属性的this指向问题求助

可以通过Proxy包装obj1，拦截对象展开时的属性遍历操作，提前执行prop2方法并修改prop1的值，同时避免重复执行。代码如下：

let prop1Value = "value1";
let prop2Executed = false;

const obj1 = new Proxy({
  get prop1() {
    return prop1Value;
  },
  prop2: function() {
    if (!prop2Executed) {
      prop1Value = 10;
      prop2Executed = true;
    }
    return "value2";
  }
}, {
  ownKeys(target) {
    // 当对象被展开遍历属性时，提前执行prop2
    if (!prop2Executed) {
      target.prop2();
    }
    return Reflect.ownKeys(target);
  }
});

// 依赖包内的初始化代码无需修改
const obj2 = {
  ...obj1,
  prop2: obj1.prop2()
};

console.log(obj2); // { prop1: 10, prop2: "value2" }

原理说明 #

• Proxy拦截属性遍历：对象展开...obj会触发Proxy的ownKeys拦截器，此时提前执行prop2方法，修改共享的prop1Value变量。
• 避免重复执行：通过prop2Executed标记确保prop2方法只会被执行一次，既保证prop1被修改，又不会因为包内代码再次调用obj1.prop2()而重复操作。
• 动态prop1取值：将prop1设置为getter，确保对象展开时获取到的是修改后的prop1Value。

这种方式完全不需要修改依赖包的源码，仅通过控制传入的obj1即可实现预期效果。

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