2016-11-01 11 views
-1

私はajaxを行い、5レベルの深さであり、各レベルには多くのアイテムを持つ多次元配列を返しました。各レベルをループしてHTML構文を作成したいと思います。すべてのレベル5が完了した後。私はすべての構文に参加し、リスト全体をHTMLに追加します。jquery、複雑な配列をループする方法

今私はそれを修正する方法について心配しています。

配列構造のような、ここで

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" 
       }] 
      }] 
     }] 
    } 
] 

私は、forループはJavaScriptを使用しようとするが、第二のレベルの後に、それは非常に醜いと追跡が困難となっています。

最初のレベルのループ

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ソリューションを歓迎します。

+0

あなたの配列のサンプルを追加してください。 –

+3

すべての要素をヒットする必要がある場合は、5次元配列はおそらくそれをどのように使用しても厄介になるでしょう。 – DBS

+1

一歩踏み込んで、ネストされたデータ構造を少なくする方法がありますか?よりフラットなデータを返すようにAjaxリクエストでより具体的にすることは可能ですか? –

答えて

3

再帰的アプローチを使用できます。

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

またはハードコード化された溶液

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

またはサブレベルが同じ建物の規則に従う場合には、よりダイナミックな溶液を使用を使用します。

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

+0

オブジェクトの配列と配列の配列がある場合、これは機能しますか?例えばOPには、オブジェクトの配列があるように見えます。あなたのソリューションは、配列の配列を扱うように見えます。 – James

+0

そうですね、問題に取り組むためにオペレーションのいくつかのデータについて尋ねていましたが、反復的なアプローチも同様に役立ちます。 –

+0

@NinaScholz私はちょうど3レベルのサンプルデータを追加しました。基本的なアイデアはそれです。私は3つのレベルを行うことができれば、私は良いアイデアを得ることができると思います。 – codenoob

関連する問題