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

<强>演示

＆＃13;

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

＆＃13;

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数组中的项目数是多少，此代码都有效：

＆＃13;

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

＆＃13;

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

3 个答案: