Javascript / ES6从1级对象生成嵌套数组

Question

我确实有一个来自API的对象，如下所示：

  this.Variations = [
  {
    attributes: [
      {name: "Cor", option: "Preto"},
      {name: "Tamanho", option: "P"},
      {name: "Tecido", option: "Algodao"},
    ],
    id : 1
  },
  {
    attributes: [
      {name: "Cor", option: "Preto"},
      {name: "Tamanho", option: "P"},
      {name: "Tecido", option: "Elastano"},
    ],
    id : 2
  },
  {
    attributes: [
      {name: "Cor", option: "Preto"},
      {name: "Tamanho", option: "M"},
      {name: "Tecido", option: "Algodao"},
    ],
    id : 3
  }, ...

我必须从中生成一个嵌套数组，以便创建我需要的体验，即用户按时间选择一个属性并加载可能的选项。

我为此苦苦思索很久了，却一无所获。

我相信我需要一个类似的数组：

array['Preto']['P']['Algodao'] = info;
array['Preto']['P']['Elastano'] = info;
array['Preto']['M']['Algodao'] = info;

有关如何操作的任何提示？

Answer 1

假设info您的id值，请尝试这种方法

var output = variations.map( s => ({ [s.attributes[0].option ] : 
     { [s.attributes[1].option ] : 
         { [ s.attributes[2].option] : s.id } } }) );

演示版

 var variations = [{ attributes: [{ name: "Cor", option: "Preto" }, { name: "Tamanho", option: "P" }, { name: "Tecido", option: "Algodao" }, ], id: 1 }, { attributes: [{ name: "Cor", option: "Preto" }, { name: "Tamanho", option: "P" }, { name: "Tecido", option: "Elastano" }, ], id: 2 }, { attributes: [{ name: "Cor", option: "Preto" }, { name: "Tamanho", option: "M" }, { name: "Tecido", option: "Algodao" }, ], id: 3 } ]; var output = variations.map( s => ({ [s.attributes[0].option ] : { [s.attributes[1].option ] : { [ s.attributes[2].option] : s.id } } }) ); console.log( output ); 

Answer 2

您可以迭代数组和嵌套对象的属性，并在叶子处分配一个值。

 var data = [{ attributes: [{ name: "Cor", option: "Preto" }, { name: "Tamanho", option: "P" }, { name: "Tecido", option: "Algodao" }], id: 1 }, { attributes: [{ name: "Cor", option: "Preto" }, { name: "Tamanho", option: "P" }, { name: "Tecido", option: "Elastano" }], id: 2 }, { attributes: [{ name: "Cor", option: "Preto" }, { name: "Tamanho", option: "M" }, { name: "Tecido", option: "Algodao" }], id: 3 }], result = {}; data.forEach(function (a) { a.attributes.reduce(function (r, b, i, bb) { return r[b.option] = i + 1 === bb.length ? a.id : r[b.option] || {}; }, result); }); console.log(result); 

 .as-console-wrapper { max-height: 100% !important; top: 0; } 

Answer 3

不管attributes数组中的项目数量如何，此代码均有效：

 var Variations = [ { attributes: [ {name: "Cor", option: "Preto"}, {name: "Tamanho", option: "P"}, {name: "Tecido", option: "Algodao"}, {name: "Foo", option: "Bar"}, ], id : 1 }, { attributes: [ {name: "Cor", option: "Preto"}, {name: "Tamanho", option: "P"}, {name: "Tecido", option: "Elastano"}, ], id : 2 }, { attributes: [ {name: "Cor", option: "Preto"}, {name: "Tamanho", option: "M"}, {name: "Tecido", option: "Algodao"}, ], id : 3 }]; const getLevelValue = (rec, att, index) => index === rec.attributes.length - 1 ? rec.id : {}, getData = variations => variations.map(rec => rec.attributes. reduce(({acc, current}, att, index) => (current = current ? current[att.option] = getLevelValue(rec, att, index) : acc[att.option] = getLevelValue(rec, att, index), {acc, current}), {acc: {}}).acc); console.log(getData(Variations));