javascript - 在 Javascript 中创建 getter 和 setter

Question

我正在按照教程在 Javascript 中创建 getter 和 setter，我有这样的代码:

// Create a new User object that accept an object of properties
function User(properties) {
    // Iterate through the properties of the object, and make
    // sure it's properly scoped
    for (var i in properties) { (function(){
        // Create a new getter for the property
        this['get' + i] = function() {
            return properties[i];
        };

        // Create a new setter for the property
        this['set' + i] = function(val) {
            properties[i] = val;
        };
    })(); }
}

// Create a new User object instance and pass in an object of
// properties to seed it with
var user = new User({
    name: 'Bob',
    age: 28
});

// Just note that the name property does not exist, as it's private
// within the property object
console.log(user.name == null);

// However, we are able to access its value using the new getname()
// method, that was dynamically generated
console.log(user.getname());

但是，控制台显示错误，指出用户没有方法 getname。代码试图动态生成 getter 和 setter 方法，我觉得没问题。有什么想法吗？

Answer 1

其他答案是正确的，因为您需要将 i 传递给您的匿名函数，但您也可以使用 ES5 Getters and Setters 执行此操作:

// Create a new User object that accept an object of properties
function User(properties) {
    var self = this; // make sure we can access this inside our anon function
    for (var i in properties) {
        (function(i) {
            Object.defineProperty(self, i, {
                // Create a new getter for the property
                get: function () {
                    return properties[i];
                },
                // Create a new setter for the property
                set: function (val) {
                    properties[i] = val;
                }
            })
        })(i);
    }
}

使用 ES5 getter 和 setter 的好处是现在您可以这样做:

var user = new User({name: 'Bob'});
user.name; // Bob
user.name = 'Dan';
user.name; // Dan

因为它们是函数，所以它们修改传入的属性，而不仅仅是对象本身。您不必再使用 getN 或 setN，您可以只使用 .N，这使得使用它看起来更像是访问属性一个对象。

但是，这种方法不是普遍可移植的(需要 IE 9+)。

下面是我在实践中可能会做的事情:

function User(properties) {
    Object.keys(properties).forEach(function (prop) {
        Object.defineProperty(this, prop, {
            // Create a new getter for the property
            get: function () {
                return properties[prop];
            },
            // Create a new setter for the property
            set: function (val) {
                properties[prop] = val;
            }
        })
    }, this);
}

上面的代码摆脱了你的 for 循环。您已经在使用匿名函数，所以不妨充分利用它。