Multiply/Clone 多次对象内部和数组 JavaScript

Question

具有以下格式的对象数组：

const data = [
{country_id: 1, country: "Greece", value: 3},
{country_id: 2, country: "Cyprus", value: 2},
{country_id: 3, country: "Turkey", value: 4}
]

如何使用 JavaScript multiply/clone 每个对象来获取以下对象数组？我想将每个对象乘以 value 中指定的次数并得到一个新数组。

const new_data = [
{id: 1, country_id: 1, country: "Greece", value: 3},
{id: 2, country_id: 1, country: "Greece", value: 3},
{id: 3, country_id: 1, country: "Greece", value: 3},
{id: 4, country_id: 2, country: "Cyprus", value: 2},
{id: 5, country_id: 2, country: "Cyprus", value: 2},
{id: 6, country_id: 3, country: "Turkey", value: 4},
{id: 7, country_id: 3, country: "Turkey", value: 4},
{id: 8, country_id: 3, country: "Turkey", value: 4},
{id: 9, country_id: 3, country: "Turkey", value: 4}
]

到目前为止，我最好的尝试是使用 Object.assign，但不幸的是地图 returns 与 data:

中的数组相同

const new_data = data.map((d, i) => {
    for (var i = 0; i < d.mult; ++i) {
      Object.assign({}, d[i]);
    }
    return d;
 })

Answer 1

最简单的方法是创建一个新数组，遍历旧数组并将重复项（使用新的 id 字段）添加到结果数组：

const data = [
    { country_id: 1, country: "Greece", value: 3 },
    { country_id: 2, country: "Cyprus", value: 2 },
    { country_id: 3, country: "Turkey", value: 4 }
]

const result = [];

let id = 0;
for (const row of data) {
    for (let i = 0; i < row.value; i++) {
        const newRow = {
            ...row, // copy old data
            id: ++id, // but set this field and increase `id`
        };
        result.push(newRow);
    }
}

console.log(result);

如果您想使用 .map，您需要使用 .flatMap 或 .map，然后使用 .flat()。您的（平面）地图将 return 一个包含 value 新行的数组。不过，您仍然需要修复 country_id。

Answer 2

您可以这样做，您只需用 value 元素填充一个数组，并将其映射到原始元素的克隆：

const data = [
{country_id: 1, country: "Greece", value: 3},
{country_id: 2, country: "Cyprus", value: 2},
{country_id: 3, country: "Turkey", value: 4}
]

console.log(
    data.flatMap((el) => new Array(el.value).fill(null).map(e => ({...el}))))

Answer 3

您可以使用 Array.from() 和 reduce 来完成。试试这个-

在这里您可以使用Array.from({length: X})创建一个临时数组。这里 {length: X} 对象表示 from 方法创建长度为 X.

的数组

之后，Array.from()方法的回调函数returns每次迭代当前项目。就是这样。

const data = [
  {country_id: 1, country: "Greece", value: 3},
  {country_id: 2, country: "Cyprus", value: 2},
  {country_id: 3, country: "Turkey", value: 4}
];

const res = data.reduce((acc, curr) => {
  const tmp = Array.from({length: curr.value}, () => curr);
  acc.push(...tmp);
  return acc;
}, []);

console.log(JSON.stringify(res));

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

Multiply/Clone 多次对象内部和数组 JavaScript

Multiply/Clone multiple times objects inside and array in JavaScript

javascript

arrays

clone

javascript-objects