Javascript 知道何时修改对象值答案

【问题标题】：Javascript Know when object value is modifiedJavascript 知道何时修改对象值
【发布时间】：2019-08-18 16:58:02
【问题描述】：

对于任何变量或其属性，有没有办法知道它的值何时被设置？

例如，假设我有：

let x = { 'a': 1, 'b': 2 };
// x.a's set operation is linked to a method
x.a = 3; // the method is automatically called

有没有一种方法可以在 a 的值更改时调用函数？很多代码会改变这个值；我不想到处添加方法调用。

我知道代理，但使用它们似乎需要一个单独的变量。意思是，x 不能是它自己的代理。

最好这种技术适用于原始和非原始。

【问题讨论】：

Is there a way I can call a function when a's value is changed? 使用 setter 和 getter
当然 x 可以是代理.... x = new Proxy(x, handler)
@charlietfl - 这不会导致循环吗？处理程序将包含一个会触发自身的 set 方法。
处理程序不应该使用x. 任何东西，因为设置一个值会调用set: function(obj, prop, value) { ...所以obj[prop] = value 不会循环 :p 但@987654329 @不会很好
@Karric 基本示例工作正常jsfiddle.net/3pfyxu9j

标签： javascript proxy datatrigger

【解决方案1】：

说实话，如果可以的话，请使用代理

如果你真的不能使用 Proxy，你可以使用 setter 和 getter 来实现这一点

虽然这确实意味着重新声明您的原始 x 对象，但我认为它是内联声明的，就像您问题中的最小、完整和可验证示例一样

let x = {
  _a: 1,
  _b: 2,
  get a() {
    return this._a;
  },
  get b() {
    return this._b;
  },
  set a(value) {
    console.log(`changing a from ${this._a} to ${value}`);
    this._a = value;
  },
  set b(value) {
    console.log(`changing b from ${this._b} to ${value}`);
    this._b = value;
  }
};
x.a = 3;

【讨论】：

【解决方案2】：

x 不能是它自己的代理

当然可以。您只需执行以下操作即可将变量更改为指向代理

x = new Proxy(x, handler)

原始示例：

const handler = {
  set: function(obj, prop, value) {
    console.log('setting prop: ', prop, ' to ', value)
    obj[prop] = value;
    return true;
  }
};

let x = { 'a': 1, 'b': 2 };

x = new Proxy(x, handler);

x.a = 3; // the method is automatically called

【讨论】：

我遇到了一个问题。给定 x = { 'a': [1] }，并且我执行 x.a = [2]，设置陷阱不会被调用。为什么？是否有重新分配的陷阱？
无法在此处复制jsfiddle.net/7uxjmszf。与上面的 cmets 相同的演示，我只是更改为数组值
奇怪，你的例子有效，我得看看我的代码有什么不同。