Question

假设你有一个类似数组的Javascript ES6 Iterable，你事先知道它的长度是有限的，将它转换为Javascript数组的最佳方法是什么？

这样做的原因是许多js库（如下划线和lodash）仅支持Arrays，因此如果您希望在Iterable上使用它们的任何函数，则必须先将其转换为数组。

在python中你可以使用list（）函数。在ES6中是否有等价物？

Answer 1

示例：

let x = new Set([ 1, 2, 3, 4 ]);

let y = Array.from(x);
console.log(y); // = [ 1, 2, 3, 4 ]

let z = [ ...x ];
console.log(z); // = [ 1, 2, 3, 4 ]

Answer 2

您可以使用Array.from方法，该方法在ES6中添加，但仅支持数组和可迭代对象，如地图和集合（也在ES6中）。对于常规对象，您可以使用Underscore的toArray方法或lodash的toArray方法，因为这两个库实际上都支持对象，而不仅仅是数组。如果你已经使用了下划线或lodash，那么幸运的是他们可以为你解决这个问题，同时为你的对象添加map和reduce等各种功能概念。

Answer 3

摘要：

Array.from()函数，它接受输入中的iterable并返回该iterable的数组。
扩展运算符：...与数组文字组合。

const map = new Map([[ 1, 'one' ],[ 2, 'two' ]]);

const newArr1  = [ ...map  ];  // create an Array literal and use the spread syntax on it
const newArr2 = Array.from( map );  // 

console.log(newArr1, newArr2);

复制数组时注意：

认识到以下事实：当我们要复制数组时，仅通过上述方法会创建浅表副本。一个示例将消除潜在的问题：

let arr = [1, 2, ['a', 'b']];

let newArr = [ ...arr ];

console.log(newArr);

arr[2][0] = 'change';

console.log(newArr);

在这里由于嵌套数组，因此引用被复制，并且没有创建新的数组。因此，如果我们更改旧数组的嵌套数组，则此更改将反映在新数组中（因为它们引用同一数组，因此该引用已被复制）。

警告的解决方案：

我们可以通过使用JSON.parse(JSON.stringify(array))创建数组的深层克隆来解决浅层副本的问题。例如：

let arr = [1, 2, ['a', 'b']]

let newArr = Array.from(arr);

let deepCloneArr = JSON.parse(JSON.stringify(arr));

arr[2][0] = 'change';

console.log(newArr, deepCloneArr)

Answer 4

以下方法已针对Maps进行了测试：

const MyMap = new Map([
  ['a', 1],
  ['b', 2],
  ['c', 3]
]);

const MyArray = [...MyMap].map(item => {
  return {[item[0]]: item[1]}
});

console.info( MyArray ); //[{"a", 1}, {"b", 2}, {"c": 3}]

Answer 5

 <<Your_Array>> = [].concat.apply([], Array.from( <<Your_IterableIterator>> ));

Answer 6

你也可以这样做：

let arr = [];
for (let elem of gen(...)){
    arr.push(elem);
}

使用ES5 +生成器功能的“艰难之路”（Fiddle适用于当前的Firefox）：

var squares = function*(n){
    for (var i=0; i<n; i++){
        yield i*i;
    }
}

var arr = [];
var gen = squares(10);
var g;
while(true){
    g = gen.next();
    if (g.done){
        break;
    }
    arr.push(g.value);
}

这两种方法当然不值得推荐，只是概念验证。

将ES6 Iterable转换为Array

6 个答案:

摘要：

复制数组时注意：

警告的解决方案：