ES6 中制作重复元素列表的等效方法是什么？答案

【问题标题】：What's the equivalent way in ES6 of making list of duplicated elements?ES6 中制作重复元素列表的等效方法是什么？
【发布时间】：2016-04-20 04:43:24
【问题描述】：

在 Python 中，我可以：l = [{'d': 3}] * 5 得到 [{'d': 3}, {'d': 3}, {'d': 3}, {'d': 3}, {'d': 3}]。

在 ES6 中执行此操作的等效方法是什么，实际上是克隆对象而不只是复制引用？

编辑：基本上，在 ES6 中是否有创建以下数组的快捷方式：

const arr = [
   {"d": 3},
   {"d": 3},
   {"d": 3},
   {"d": 3},
   {"d": 3},
   {"d": 3},
   {"d": 3},
   {"d": 3},
   {"d": 3},
   {"d": 3},
   {"d": 3},
   {"d": 3},
];

?

【问题讨论】：

您的 Python 代码只是复制了引用，不是吗？ l[0]['d'] = 2 影响整个列表。
是的，我知道，而且我已经表明我想克隆对象，而不仅仅是复制引用。
@Marius 所说的非常完美。阅读Python list of lists, changes reflected across sublists unexpectedly

标签： javascript arrays ecmascript-6

【解决方案1】：

字面意思是

const arr = Array(5).fill({d: 3});

这将用相同的对象引用填充数组五次。

获得克隆的过程稍微复杂一些。考虑：

Array.apply(null, Array(5)).map(_ => ({d: 3}));

或

Array(5).fill(0).map(_ => ({d: 3}));

这是一个快速而肮脏的性能比较。对于 n 的小尺寸，O(n) fill 似乎比实际创建两个数组的性能要好。随着 n 的增长，这似乎在翻转。

一定要玩弄数字，如果这是一个重要因素，请构建自己的测试。

JSFiddle

'use strict';

const loops = 100000;
const size = 50;

const a0 = performance.now();
for (let i = 0; i < loops; i++)
	Array.apply(null, Array(size)).map(_ => ({d: 3}));
const a1 = performance.now();
console.log('Apply %fms', a1 - a0);


const f0 = performance.now();
for (let i = 0; i < loops; i++)
	Array(size).fill(0).map(_ => ({d: 3}));
const f1 = performance.now();
console.log('Fill %fms', f1 - f0);

另外，请注意apply 方法的好处是在用普通函数替换箭头函数时是有效的 ES5。

【讨论】：

【解决方案2】：

我想你可以这样做：

new Array(6).fill(0).map(() => ({d: 3}));

（其中 6 是您想要的数字。）

不过，它并不那么简洁。

【讨论】：

【解决方案3】：

这个解决方案似乎是一个不错的选择：

var n = 10;
var items = Array.from(Array(n), _ => ({d: 3}));

使用地图功能将确保创建对象的克隆。
查看更多关于Array.from()的信息。

【讨论】：

【解决方案4】：

我不知道在数组中复制对象的等价物，就像你从 python 那里一样，但是在 JavaScript 中克隆对象属性的最简单方法是使用 JSON.parse(JSON. stringify([myJsObj]))，但是如果您在循环中执行此操作，可能会导致性能下降。

let o = {d: 3}
let a = [];

for(let i = 0; i < 5; i++) {
    a.push(JSON.parse(JSON.stringify(o)));
}

【讨论】：

【解决方案5】：

l = new Array(3).fill({'d': 3})

【讨论】：