Question

我有这个对象：

function formBuddy()
{
    var fields = new Array();
    var labels = new Array();
    var rules = new Array();
    var count=0;

    this.addField = function(field, label, rule)
    {
        fields[count] = field;
        labels[field] = label;
        rules[field] = rule;
        count = ++count;
    }
}

以这种方式使用：

var cForm=new formBuddy();
cForm.addField("c_first_name","First Name","required");
cForm.addField("c_last_name","Last Name","required");

问题是，在addField()函数中fields数组设置正确（可能是因为数字索引用于引用它），而另外2个数组（{{1}和labels）根本没有被触及。执行rules会在firebug中将它们显示为空。

我需要更改哪些才能使它们正常工作？我仍然想通过字段的字符串索引来引用规则和标签。

Answer 1

改为使用对象：

function formBuddy()
{
    var fields = {};
    var labels = {};
    var rules = {};
    var count = 0;

    this.addField = function(field, label, rule)
    {
        fields[count] = field;
        labels[field] = label;
        rules[field] = rule;
        count++;
    }
}

但是作为Christoph already mentioned，我也会将这些信息存储在单个数据结构中。例如：

function formBuddy() {
    var fields = {};
    this.addField = function(name, label, rule) {
        fields[name] = {
            name: name,
            label: label,
            rule: rule
        };
    };
    this.getField = function(name) {
        return fields[name];
    };
}

var cForm=new formBuddy();
cForm.addField("c_first_name","First Name","required");
cForm.addField("c_last_name","Last Name","required");
alert(cForm.getField("c_last_name").label);

Answer 2

fields应该是一个数组，而labels和rules应该是对象，因为您希望将字符串用作键。此外，addField()对于FormBuddy()的每个实例都是相同的（构造函数的名称应该大写）并且应该驻留在原型中，即

function FormBuddy() {
    this.fields = []; // this is the same as `new Array()`
    this.labels = {}; // this is the same as `new Object()`
    this.rules = {};
}

FormBuddy.prototype.addField = function(field, label, rule) {
    this.fields.push(field);
    this.labels[field] = label;
    this.rules[field] = rule;
};

您可以通过

访问标签/规则

var buddy = new FormBuddy();
buddy.addField('foo', 'bar', 'baz');
alert(buddy.labels['foo']);
alert(buddy.rules.foo);

只是为了进一步激怒Luca;），这是另一个版本，它也没有封装任何东西：

function FormBuddy() {
    this.fields = [];
}

FormBuddy.prototype.addField = function(id, label, rule) {
    var field = {
        id : id,
        label : label,
        rule : rule
    };

    this.fields.push(field);
    this['field ' + id] = field;
};

FormBuddy.prototype.getField = function(id) {
    return this['field ' + id];
};

var buddy = new FormBuddy();
buddy.addField('foo', 'label for foo', 'rule for foo');

它类似于Gumbo的第二个版本，但是他的fields对象被合并到FormBuddy实例中。添加了一个名为fields的数组，以允许快速迭代。

要访问字段的标签，规则或ID，请使用

buddy.getField('foo').label

要遍历字段，请使用

// list rules:
for(var i = 0, len = buddy.fields.length; i < len; ++i)
    document.writeln(buddy.fields[i].rule);

Answer 3

在Javascript中将数组视为对象，因此您的代码片段工作，只是firebug的console.log没有向您显示数组中的“对象”，而只是数组值...

使用for(var i in obj)查看数组包含的对象值：

function formBuddy() {
    var fields = new Array();
    var labels = new Array();
    var rules = new Array();
    var count=0;

    this.addField = function(field, label, rule)
    {        
        fields[count] = field;
        labels[field] = label;
        rules[field] = rule;
        count = ++count;

        for(var i in labels) {
            console.log(labels[i]);
        }
        for(var i in rules) {
            console.log(rules[i]);
        }

        console.log(labels.c_last_name);
        // or
        console.log(labels["c_last_name"]);
    }
}

var cForm = new formBuddy();
cForm.addField("c_last_name","Last Name","required");

javascript中的关联数组

3 个答案: