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>