Javascript：我需要多维数组，数组中的对象还是…？

Question

因此，我有一个动态变量，该变量可以是用户决定的5到<99之间的任何整数。

var topLevelMenusTotalNum

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

我将这些值存储在大小可以动态变化的存储系统中的另一种方式是什么？

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

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

但是，如何根据用户创建的数量动态创建menu1 ， menu2 ， menu3等对象？

我应该在数组中创建对象吗？ 或者是其他东西？

Answer 1

顺序重要吗？ 如果是这样，请使用数组。

名称重要吗？ 如果是这样，请使用具有命名属性的对象。

没关系吗 那么这并没有真正的改变。 数组稍微容易循环。

Answer 2

如果您有一个对象，则可以向其动态添加项目，如下所示：

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)
    }
}

Answer 3

我建议您在顶层使用一个对象，每个对象都将包含数组作为类成员。 对象将帮助您基于用户动态创建，并且用户的每个对象将包含一个具有五个属性的数组。

Answer 4

我建议对对象进行操作，只要可以命名参数即可。

如果您需要很多对象，只需保留一个对象数组即可进行搜索/排序/过滤。

 //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>