Javascript:我需要多维数组,数组中的对象还是......?

时间:2016-11-30 10:22:05

标签: javascript arrays object

所以我有一个动态变量,可以是从5到5的任何整数。 99由用户决定。

var topLevelMenusTotalNum

每个顶级菜单都有5个我想要存储的固定属性,主要是整数和一些长数。然后回想一下我的代码。

对于我来说,将这些值存储在动态大小的存储系统中是什么?

我猜我应该将每个顶级菜单存储为一个对象,具有5个属性,即

menu1.property1 = 500
menu1.property2 = 23
...
menu1.property5 = 24.3445345644

但是,如何根据用户创建的数量动态创建menu1menu2menu3等对象?

我应该在数组中创建对象吗?或其他什么?

4 个答案:

答案 0 :(得分:3)

订单是否重要?如果是这样,请使用数组。

名称是否重要?如果是这样,请使用具有命名属性的对象。

两者都不重要?然后它并没有真正有所作为。数组更容易循环。

答案 1 :(得分:1)

如果你有一个对象,你可以像这样动态地添加项目:

var menus = {
    "menu1": {
        //properties
    },
    "menu2": {
        //properties
    } //etc...
}

然后你可以像这样添加它:

menus['menu' + newMenuNR] = {'property1': 21, 'property2': 10} //<-- properties in there

这是完全动态的,以后不会导致问题,循环通过对象,你可以使用二维循环。

for(menu in menus) {
    for(item in menu) {
        alert(item.['property1']); //displays property of item in menu in menus (replace property with your own property names)
    }
}

答案 2 :(得分:0)

我建议你使用顶层对象,每个对象都包含数组作为类成员。 Object将帮助您根据用户动态创建,用户的每个对象都将包含一个具有五个属性的数组。

答案 3 :(得分:0)

只要可以命名参数,我建议使用对象。

如果您需要大量对象,只需保留一组对象进行搜索/排序/过滤。

//Class (Hide this in some library script)
var Menu = (function () {
    function Menu(parameters) {
        if (parameters === void 0) { parameters = {}; }
        this.node = document.createElement("ul");
        this.items = [];
        this.width = 100;
        this.height = 100;
        this.name = "";
        this.title = "";
        this.children = [];
        //Apply parameters
        for (var key in parameters) {
            if (parameters.hasOwnProperty(key) && this.hasOwnProperty(key)) {
                this[key] = parameters[key];
            }
        }
        //Apply node parameter
        this.node.title = this.title;
        //Add to static
        Menu._menus.push(this);
    }
    Menu.prototype.render = function () {
        //Reset contents
        this.node.innerHTML = "";
        //Append sub-menues
        for (var childIndex = 0; childIndex < this.children.length; childIndex++) {
            var child = this.children[childIndex];
            var li = document.createElement("li");
            li.appendChild(child.render());
            this.node.appendChild(li);
        }
        //Append generic items
        for (var itemIndex = 0; itemIndex < this.items.length; itemIndex++) {
            var item = this.items[itemIndex];
            var li = document.createElement("li");
            li.innerHTML = item;
            this.node.appendChild(li);
        }
        //Return node
        return this.node;
    };
    Menu._menus = [];
    return Menu;
}());
//Implementation
//create menu
var topMenu = new Menu({ items: ["Just testing"], title: "Super!" });
//Add anonymous submenues
topMenu.children
    .push(new Menu({ items: ["item 1"], title: "sub", name: "sub1" }), new Menu({ items: ["item 3", "item 2"], title: "sub", name: "sub2" }));
//Add to "bigList"
document.getElementById("bigList").appendChild(topMenu.render());
//Updates incoming
setTimeout(function () {
    //Find menu with the most items + children (Which is easy with named parameters)
    var m = Menu._menus
        .filter(function (a) {
        return a.title == "sub";
    }).sort(function (a, b) {
        return (b.items.length + b.children.length) - (a.items.length + a.children.length);
    })[0];
    //Add new item
    m.items.push("Sweet right?");
    //Update node
    m.render();
}, 2000);
setTimeout(function () {
    //Find last menu
    var m = Menu._menus
        .reverse()[0];
    //Remove last item
    m.items.splice(m.items.length - 1, 1);
    //Update node
    m.render();
}, 4000);
<div id="bigList">
Named parameters are lovely :-)
</div>