Question

让对象userSingleton定义为：

var userSingleton  = new function() {
    var _user = undefined;
    Object.defineProperty(this, 'activeUser', {
        get: function() {
            console.log("Getter called, done something cool");
            return _user;
        },
        set: function(val) {
            console.log("Setter called, do something cooler");
            _user = val;
        }
    });
}

现在，如果我去使用它，userSingleton.activeUser = {name: 'John Doe'};效果很好！我得到一个“塞特打电话，做点凉爽的事”。

但是，如果我尝试userSingleton.activeUser.name = 'John Doe';，我会收到一个“Getter call，做了一些很酷的事情”而且userSingleton._user没有更新。

正在尝试设置getter（name）返回的对象的userSingleton.activeUser属性。

当任何（定义时未知）属性被分配给/修改时，如何调用特定函数？

Answer 1

基于深层嵌套示例的重新访问的解决方案Proxy（NB：ECMA Script 2015）：

var handler = {
    get: function (target, key) {
        return target[key];
    },
    set: function (target, key, value) {
        do_action(target, key, value);
        if (typeof value === 'object') {
            target[key] = new Proxy(value, handler);
        } else {
            target[key] = value;
        }
    }
};

function do_action(target, key, value) {
    console.log("firing action on:", key, value)
}

function singletonUser() {
    if (!this._singleton) {
        const _user = {}
        this._singleton = {
            activeUser: new Proxy(_user, handler)
        };
    }

    return this._singleton;
}

var userSingleton = singletonUser();

userSingleton.activeUser.name = 'pippo';
userSingleton.activeUser.age = 10;

// a deeply nested example
userSingleton.activeUser.github = {};

userSingleton.activeUser.github.followers = ["gino", "pino"]

在分配子项时调用对象setter

1 个答案: