如何根据numberOfUnit操作JavaScript对象数组生成新数组？

你需要把包含numberOfUnit的对象数组，拆分成每个类型对应numberOfUnit数量的新对象，每个新对象的propertyUnitType要加上序号。这里有几种实用的实现方式：

原始输入数组 #

const unitsAndRates = [
  { propertyUnitType: "store", propertyUnitRate: "20000", numberOfUnit: 4 },
  { propertyUnitType: "duplex", propertyUnitRate: "20000", numberOfUnit: 3 }
];

预期输出数组 #

const generated = [
  { propertyUnitType: "store1", propertyUnitRate: "20000" },
  { propertyUnitType: "store2", propertyUnitRate: "20000" },
  { propertyUnitType: "store3", propertyUnitRate: "20000" },
  { propertyUnitType: "store4", propertyUnitRate: "20000" },
  { propertyUnitType: "duplex1", propertyUnitRate: "20000" },
  { propertyUnitType: "duplex2", propertyUnitRate: "20000" },
  { propertyUnitType: "duplex3", propertyUnitRate: "20000" }
];

实现方法 #

方法1：flatMap + Array.from（简洁现代） #

这是最推荐的写法，利用flatMap的扁平化特性，结合Array.from快速生成对应长度的数组：

const generated = unitsAndRates.flatMap(item => {
  return Array.from({ length: item.numberOfUnit }, (_, index) => ({
    propertyUnitType: `${item.propertyUnitType}${index + 1}`,
    propertyUnitRate: item.propertyUnitRate
  }));
});

• flatMap会自动把每个元素返回的数组展开，避免嵌套数组的麻烦
• Array.from({ length: item.numberOfUnit })创建一个长度等于numberOfUnit的空数组
• 映射函数里用index + 1生成1开头的序号，拼接成新的propertyUnitType，同时保留原有的propertyUnitRate

方法2：flatMap + 普通循环（直观易懂） #

如果觉得Array.from不够直观，用普通循环生成子数组也很清晰：

const generated = unitsAndRates.flatMap(item => {
  const items = [];
  for (let i = 1; i <= item.numberOfUnit; i++) {
    items.push({
      propertyUnitType: `${item.propertyUnitType}${i}`,
      propertyUnitRate: item.propertyUnitRate
    });
  }
  return items;
});

逻辑很直白：对每个原始对象，循环numberOfUnit次，每次生成一个带序号的新对象，最后通过flatMap把所有子数组合并成一个大数组。

方法3：reduce累积法（传统思路） #

如果你习惯用reduce处理数组累积操作，这种写法也能达到目的：

const generated = unitsAndRates.reduce((accumulator, item) => {
  for (let i = 1; i <= item.numberOfUnit; i++) {
    accumulator.push({
      propertyUnitType: `${item.propertyUnitType}${i}`,
      propertyUnitRate: item.propertyUnitRate
    });
  }
  return accumulator;
}, []);

初始值是一个空数组，每次遍历原始对象时，把生成的新对象都添加到累积数组里，最终得到目标结果。

内容的提问来源于stack exchange，提问作者Chibuike Patrick