Question

我有以下带有嵌套数组的数组：

docker-compose

我想从每对对象创建一个对象数组，例如：

const options = [
  [
    {
      label: "Blue",
      option_id: "1"
    },
    {

      label: "Small",
      option_id: "2"
    }
  ],
  [
    {
      label: "Red",
      option_id: "1"
    },
    {
      label: "Large",
      option_id: "2"
    }
  ]
];

编辑：感谢大家的精彩回答

Answer 1

在.map数组上使用options，并将reduce的每个子数组放入对象：

const options = [
  [
    {
      label: "Blue",
      option_id: "1"
    },
    {

      label: "Small",
      option_id: "2"
    }
  ],
  [
    {
      label: "Red",
      option_id: "1"
    },
    {
      label: "Large",
      option_id: "2"
    }
  ]
];
const result = options.map(arr =>
  arr.reduce(
    (a, { label, option_id }) => {
      a.label += (a.label ? ' ' : '') + label;
      a.option_id.push(option_id);
      return a;
    },
    { label: '', option_id: [] }
  )
);
console.log(result);

Answer 2

reduce是进行这些数组转换的好方法。

const options = [
  [
    {
      label: "Blue",
      option_id: "1"
    },
    {

      label: "Small",
      option_id: "2"
    }
  ],
  [
    {
      label: "Red",
      option_id: "1"
    },
    {
      label: "Large",
      option_id: "2"
    }
  ]
];

const newArray = options.reduce((prev,current)=>{
  const label = current.map(o=>o.label).join(' ')
  const optionid = current.map(o=>o.option_id)
  return [...prev,{option_id:optionid,label}]
},[])

console.log(newArray)

Answer 3

您可以映射并收集数据。

const
    options = [[{ label: "Blue", option_id: "1" }, { label: "Small", option_id: "2" }], [{ label: "Red", option_id: "1" }, { label: "Large", option_id: "2" }]],
    result = options.map(a => a.reduce((r, { label, option_id }) => {
        r.label += (r.label && ' ') + label;
        r.option_id.push(option_id);
        return r;
    }, { label: '', option_id: [] }));

console.log(result);

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

Answer 4

使用map和reduce。 map将返回一个新数组，并在map的回调函数内部，使用reduce，默认情况下在累加器中传递一个对象。

const options = [
  [{
      label: "Blue",
      option_id: "1"
    },
    {

      label: "Small",
      option_id: "2"
    }
  ],
  [{
      label: "Red",
      option_id: "1"
    },
    {
      label: "Large",
      option_id: "2"
    }
  ]
];



let k = options.map(function(item) {
  return item.reduce(function(acc, curr) {
    acc.label = `${acc.label} ${curr.label}`.trim();
    acc.option_id.push(curr.option_id)

    return acc;
  }, {
    label: '',
    option_id: []
  })
});

console.log(k)

Answer 5

您可以使用map()和reduce()：

const options = [
  [
    {
      label: "Blue",
      option_id: "1"
    },
    {

      label: "Small",
      option_id: "2"
    }
  ],
  [
    {
      label: "Red",
      option_id: "1"
    },
    {
      label: "Large",
      option_id: "2"
    }
  ]
];

const result = options.map((x) => {
  let label = x.reduce((acc, val) => { 
    acc.push(val.label);
    return acc;
  }, []).join(',');
  let optArr = x.reduce((acc, val) => { 
    acc.push(val.option_id);
    return acc;
  }, []);
  return {
    label: label,
    option_id: optArr
  }
});

console.log(result);

Answer 6

您始终可以迭代地进行处理，首先用带编号的for循环编写内容：

const options = [[{label: "Blue",option_id: "1"},{label: "Small",option_id: "2"}],
                 [{label: "Red",option_id: "1"},{label: "Large",option_id: "2"}]];
  
const result = [];
for(var i=0; i<options.length; i++){
  var arr = options[i];
  var labels = [];
  var ids = [];
  for(var j=0; j<arr.length; j++){
    var opt = arr[j];
    labels.push(opt.label);
    ids.push(opt.option_id);
  }
  result.push({label:labels.join(" "),option_id:ids});
}
console.log(result);

然后使用forEach

丢弃索引

const options = [[{label: "Blue",option_id: "1"},{label: "Small",option_id: "2"}],
                 [{label: "Red",option_id: "1"},{label: "Large",option_id: "2"}]];
  
const result = [];
options.forEach(arr => {
  var labels = [];
  var ids = [];
  arr.forEach(opt => {
    labels.push(opt.label);
    ids.push(opt.option_id);
  });
  result.push({label:labels.join(" "),option_id:ids});
});
console.log(result);

然后可以简单地map-ed进行外部循环：

const options = [[{label: "Blue",option_id: "1"},{label: "Small",option_id: "2"}],
                 [{label: "Red",option_id: "1"},{label: "Large",option_id: "2"}]];
  
const result = options.map(arr => {
  var labels = [];
  var ids = [];
  arr.forEach(opt => {
    labels.push(opt.label);
    ids.push(opt.option_id);
  });
  return {label:labels.join(" "),option_id:ids};
});
console.log(result);

并尝试reduce内循环：

const options = [[{label: "Blue",option_id: "1"},{label: "Small",option_id: "2"}],
                 [{label: "Red",option_id: "1"},{label: "Large",option_id: "2"}]];
  
const result = options.map(arr => 
  (lists => ({label:lists.labels.join(" "),option_id:lists.ids}))
  (arr.reduce((lists,opt) => {
    lists.labels.push(opt.label);
    lists.ids.push(opt.option_id);
    return lists;
  },{labels:[],ids:[]}))
);
console.log(result);

arr.reduce是此处lists =>函数的参数（它替换了先前片段中的简单return行）。我只是想保留join，但这样做有点过头了。因此，保留显式变量不会有什么问题。

从包含对象的嵌套数组数组创建新对象

6 个答案: