ES6Iterableを配列に変換する

配列のようなJavascriptES6 Iterableがあり、長さが有限であることが事前にわかっているとしましょう。これをJavascript配列に変換する最良の方法は何ですか。

その理由は、アンダースコアやlodashなどの多くのjsライブラリは配列のみをサポートしているため、Iterableでそれらの関数のいずれかを使用する場合は、最初に配列に変換する必要があります。

Pythonでは、list（）関数を使用できます。ES6に同等のものはありますか？

Array.fromまたはspread演算子を使用できます。

例：

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 ]

概要：

• 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)

ES6で追加されているArray.fromメソッドを使用できますが、サポートされるのは配列と、マップやセットなどの反復可能なオブジェクト（ES6でも提供されます）のみです。通常のオブジェクトの場合、UnderscoreのtoArrayメソッドまたはlodashのtoArrayメソッドを使用できます。これは、両方のライブラリが実際には配列だけでなくオブジェクトを強力にサポートしているためです。すでにアンダースコアまたはlodashを使用している場合は、幸いなことに、オブジェクトのmapやreduceなどのさまざまな機能概念を追加するとともに、問題を処理できます。

次のアプローチがマップに対してテストされています。

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}]

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

次のこともできます。

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);
}

ただし、どちらのアプローチも確かに推奨されるものではなく、概念実証にすぎません。