动态创建对象的实例

CallMeMisterX

我正在尝试创建一个简单的界面来生成JSON格式的数据。可以成功添加第一个对象。但是,当我尝试添加另一个对象(将其添加到“ myDict”数组对象:请参见下面的代码)时,原始对象的值将被覆盖,而且似乎也添加了一个空键/值对。

我猜想这与每次将新对象添加到“ myDict”时都不创建“ createObj”对象的新实例有关。因此,我试图找出如何动态创建新实例的方法。到目前为止,这是我的代码:

// VARIABLES
var myDict = [];

// CLASSES
function createObj() {
    this.myObj = {};
}
createObj.prototype.newPair = function() {
    this.newKey = document.getElementById('key').value;
    this.newValue = document.getElementById('value').value;
    this.myObj[this.newKey] = this.newValue;

    console.log(this.myObj);

    document.getElementById('key').value = null;
    document.getElementById('value').value = null;
    document.getElementById('key').focus();
}
createObj.prototype.addIt = function() {
    myDict.push(this.myObj);
    console.log(myDict);
}

// ACTIONS
$('#createNew').click(function() {
    $('#item').show();
    var myItem = new createObj();

    $('button#create').click(function() {
        myItem.newPair();
    });

    $('#done').click(function() {
        $('#item').hide();
        myItem.addIt();
    });
});

我在这里回顾了一个类似的堆栈溢出问题:动态创建对象实例的惯例是什么?

但这似乎无法为我的问题提供任何答案。如果有帮助,这里是JSFiddle:http : //jsfiddle.net/mysterexs/rffmV/

注意:JSFiddle不会显示输出,但是会为您提供所有代码并提供更多上下文。任何帮助表示赞赏。

grape_mao

我对JQuery知之甚少,但是您的问题似乎是您每次都在第一个事件句柄中添加一个新的事件处理程序,并且为其添加了额外的属性myItem(由于闭包,该函数仍然可以访问它),和额外的对象数组(相同的原因)。做这样的事情:

var myItem;
// ACTIONS
$('#createNew').click(function () {
    $('#item').show();
    myItem = new createObj();

});
$('button#add').click(function () {  
        myItem.newPair();
    });
$('#done').click(function () {
        $('#item').hide();
        myItem.addIt();
    });

我使用了一个全局变量来简化操作,您可以找到一些更好的解决方案。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章