Question

在网上搜索时，我遇到了一个post，它显示了以下动态生成方法示例无法按计划运行的原因：

// Create a new user object that accepts an object of properties
function User( properties ) {
    // Iterate through the properties of the object, and make sure
    // that it's properly scoped (as discussed previously)
    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;
        };
    })(); }
}

原因是匿名函数，它使用“this”关键字是“window”的上下文，而不是“User”。

1）为什么匿名函数中的this关键字引用“window而不是”User“？

2）是否有一种可接受的常用方法来创建“动态生成方法”？

谢谢，

乔尔

Answer 1

this引用窗口对象而不是User的原因是因为this取决于调用方。在这种情况下，foreach包含一个立即调用的匿名函数。调用者将被视为窗口对象。

它无法正常工作的原因是代码写得不好。将上下文和i - 变量作为范围传递将是一件简单的事情：

function User( properties ) {
    // Iterate through the properties of the object, and make sure
    // that it's properly scoped (as discussed previously)
    for ( var i in properties ) { (function(x){
        // Create a new getter for the property
        this[ "get" + x ] = function() {
            return properties[x];
        };
        // Create a new setter for the property
        this[ "set" + x ] = function(val) {
            properties[x] = val;
        };
    }).call(this, i); }
}

Answer 2

我确实尝试了所有的例子，但没有人能够完美地运作。

这是工作代码：

function User( properties ) {
    // Iterate through the properties of the object, and make sure
    // that it's properly scoped (as discussed previously)

    var that = this;

    for ( var i in properties ) { (function(){
        // Create a new getter for the property

        that[ "get" + i ] = function(i) {
            return function (){
                console.debug(i);
                return properties[i];        
            }

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

var user = new User({
    name: "Bob",
    age: 44
});

console.log(user.getname(), user.getage()) //Bob, 44
user.setname("Antonio");
user.setage(33);
console.log(user.getname(), user.getage()) //Antonio, 33

以下链接的更多说明 computerone.altervista.org

Answer 3

您需要设置“this”元素的正确引用。您在匿名范围内。作为“用户”功能的第一行，你应该声明一个像

这样的变量

var _this = this;

然后，你不得不称之为[“get”+ i]，而是要调用_this [“get”+ i]

Answer 4

尝试：

// Create a new user object that accepts an object of properties
function User( properties ) {
    // Iterate through the properties of the object, and make sure
    // that it's properly scoped (as discussed previously)

    var self = this;

    for ( var i in properties ) { (function(){
        // Create a new getter for the property
        self[ "get" + i ] = function() {
            return properties[i];
        };
        // Create a new setter for the property
        self[ "set" + i ] = function(val) {
            properties[i] = val;
        };
    })(); }
}

Answer 5

问题是缺少new运算符。如果您在没有User的情况下对其进行实例化，this内部将为window。

这不起作用：

var george = User(properties);

这将有效：

var george = new User(properties);

这个tutorial很有意思。

JavaScript中的动态生成方法

5 个答案: