Question

我做了一个ajax并返回了一个5级深度的多维数组，每个级别都有很多项。我想遍历每个级别并创建HTML语法。完成所有5级之后。我将加入所有语法并将整个列表附加到HTML中。

现在我担心如何循环纠正它。

数组结构如下所示

var array = [object, object, object, object]
            |0 object level 1
              |1 object level 2
                |0 object level 3
                  |0 object level 4
                    |0 object level 5
            |1 object
            |2 object 
            |3 object

这是一个简化的样本数据

var test = [
    {
        "someid":"25",
        "level1":[
            {
                "name":"john doe",
            }
            "level2": [
            {
                "order_quantity":"1",
                "order_price":"12.00",
                "level3":[
                {
                    "addon_price":"2.00"
                }]
            }]
        }]
    }
]

我尝试使用javascript for循环但是在第二级之后它变得非常难看并且难以跟踪。

第一级循环

for(i=0; i<array.length;i++)

二级循环

for(n=0; n<array[i].level1.length;n++)

第三级循环

for(y=0;y<array[i].level2[n].level3.length;y++)

我不认为这是正确的方法。

像这样循环遍历数组的正确方法

我也有jquery。但不知道如何使用$ .each来做到这一点。

欢迎使用jquery解决方案。

Answer 1

您可以使用递归方法。

＆＃13;

var array = [[[1, 2, 3, 4], [[5, 6]]], [7, 8], [9, 10], [11, 12]];

array.forEach(function iter(a) {
    if (Array.isArray(a)) {
        a.forEach(iter);
        return;
    }
    console.log(a);
});

＆＃13;

或使用硬编码解决方案

＆＃13;

var test = [{ someid: "25", level1: [{ name: "john doe", level2: [{ order_quantity: "1", order_price: "12.00", level3: [{ addon_price: "2.00" }] }] }] }];

test.forEach(function (a) {
    a.level1.forEach(function (b) {
        b.level2.forEach(function (c) {
            c.level3.forEach(function (d) {
                console.log(d.addon_price);
            });
        });
    });
});

＆＃13;

如果子级别遵循相同的构建规则，则使用更动态的解决方案。

＆＃13;

var test = [{ someid: "25", level1: [{ name: "john doe", level2: [{ order_quantity: "1", order_price: "12.00", level3: [{ addon_price: "2.00" }] }] }] }];

test.forEach(function iter(level) {
    return function (a) {
        if (Array.isArray(a['level' + level])) {
            a['level' + level].forEach(iter(level + 1));
            return;
        }
        Object.keys(a).forEach(function (k) {
            console.log(a[k]);
        });
    }
}(1));

＆＃13;

jquery，如何遍历复杂的数组

1 个答案: