JavaScript

：

：

Array.from()メソッド

　編集：2022.08.04 by T.A.

→

反復可能オブジェクトなどから、浅くコピーされた新しい Array を生成します。

Array.from(arrayLike[, mapFn[, thisArg]] )
arrayLike オブジェクトまたは反復可能オブジェクト、文字列、配列。
mapFn 省略可。配列のすべての要素に対して呼び出される Map 関数。
thisArg 省略可。mapFn を実行する時に this として使用する値。
戻り値

Array。

解説

Array.from() は、以下のものから Array を生成します：

Array.from() は任意の引数 mapFn を持ちます。これは、作成した配列（もしくは、サブ･クラス･オブジェクト）のすべての要素に対して map 関数を実行できます。

より明確に言うと、中間配列を生成しないことを除いて、Array.from(obj, mapFn, thisArg) は Array.from(obj).map(mapFn, thisArg) と同じ結果です。中間配列は、適切な型に合うように丸められた値を持つ必要があるため、typed arrays のような配列サブ･クラスにとっては特に重要です。

これは、型付き配列のような特定の配列のサブ･クラスでは特に重要です。なぜなら、中間配列の値は適切な型に収まるように切り捨てられている必要があるからです。

from() メソッドの length プロパティは 1 です。

ES2015 では、class 構文により定義済みクラスとユーザー定義クラスの両方をサブクラス化することができます。結果として、Array.from のような静的メソッドは Array のサブクラスに「継承」され、Array ではなくサブクラスのインスタンスを生成します。

例

String からの配列の生成： 

D=Array.from('foo'); //＝[ "f", "o", "o" ]

Set からの配列の生成： 

const set=new Set(['foo', 'bar', 'baz', 'foo']);
D=Array.from(set); //＝[ "foo", "bar", "baz" ]

Map からの配列の生成： 

const map = new Map([[1, 2], [2, 4], [4, 8]]);
D=Array.from(map); //＝[[1, 2], [2, 4], [4, 8]]

const mapper = new Map([['1', 'a'], ['2', 'b']]);
D=Array.from(mapper.values()); //＝['a', 'b'];
D=Array.from(mapper.keys());   //＝['1', '2'];

配列のようなオブジェクト (引数) からの配列の生成： 

function f() {
  return Array.from(arguments);
}

D=f(1, 2, 3); //＝[ 1, 2, 3 ]

アロー関数と Array.from の使用： 

// 要素を操作するためのマップ関数としてアロー関数を使用
D=Array.from([1, 2, 3], x => x + x); //＝[2, 4, 6]

// 連番の生成：
// 配列はそれぞれの場所が `undefined` で初期化されるため、以下の `v` の値は `undefined` になる
D=Array.from({length: 5}, (v, i) => i); //＝[0, 1, 2, 3, 4]

S='A\uD835\uDC68B\uD835\uDC69C\uD835\uDC6A';
I=S[Symbol.iterator](); //＝イテレーター オブジェクト
A=Array.from(I); //＝[object]：A,𝑨,B,𝑩,C,𝑪
	//0＝[string]：A
	//1＝[string]：𝑨
	//2＝[string]：B
	//3＝[string]：𝑩
	//4＝[string]：C
	//5＝[string]：𝑪

¶省く

テスト