Question

我需要创建一个存储其他对象的对象。大对象的每个属性都有两个属性“value”和“callback”。

let bigObj = {
    first: {
        value: true,
        callback: () => {}
    },
    second: {
        value: false,
        callback: () => {}
    }, {...}
}

我希望能够通过使用bigObj.first / bigObj.first =“false”来获取和更改value属性，并通过经典方法获取回调...：bigObj.first.callback =（）=＆gt; {}。

每次更改属性'value'时，我都想调用它的回调函数。

这就是我做的事情

var proxy = new Proxy({
    first: {
        value: true,
        callback: () => {}
    }
}, {
    get(target, key) {
        return key in target ? target[key].value : null;
    },
    set(target, key, value) {
        target[key] ? target[key].value = value : target[key] = {value, callback: () => {}};
        key !== 'callback' && target[key].callback();
        return true;
    }
});

问题是我无法更改回调属性。

proxy.first.callback = () => console.log('new cb'); // won't do anything.

您对我如何更改代码有任何想法，以便它可以工作吗？

谢谢。

Answer 1

你设置它的方式，proxy.first返回一个布尔值。因此，proxy.first.callback =最终成为false.callback =或true.callback =。这些至少不会抛出异常，但它们是无用的。如果值是对象而不是布尔值，则可以使值本身成为代理，但不能创建以非对象作为目标的代理。

另一种选择是拥有一个特殊的值，你首先设置它，告诉它插入回调。下面是一个示例，如果您传入像{callback：（）=＆gt;这样的对象{}}，然后它将插入作为回调。但是其他任何东西都会被设置为值。

var proxy = new Proxy({
    first: {
        value: true,
        callback: () => {}
    }
}, {
    get(target, key) {
        return key in target ? target[key].value : null;
    },
    set(target, key, value) {
        if (value && value.callback) {
           target[key] ? target[key].callback = value.callback : target[key] = {value: null, callback: value.callback};
           return true;
        } else {
          target[key] ? target[key].value = value : target[key] = {value, callback: () => {}};
          target[key].callback();
          return true;
        }
    }
});

proxy.first = {callback: () => console.log('got a callback')};

proxy.first = false;

Javascript ES6代理

1 个答案: