LINDORのAdvent Calendar（本物）の3日目を開けたところ。
配列とかおれおれAdvent Calendar2018 – 03日目

コンストラクターの引数に複数の値を与えるとそれらを要素に持つ配列が新規作成される一方で、 数値をひとつだけを与えた場合、要素数がその数値であるが中身が空の配列が作成されます。

console.log(Array(11, 22, 33)); // => [ 11, 22, 33 ]
console.log(Array('1')); // => [ '1' ]

// [3]にならない
console.log(Array(3)); // => [ <3 empty items> ]

と、「数値ひとつだけの配列」を作ることができないわけですね。

Array.of() なら、それができます。

// やったぜ
console.log(Array.of(3)); // => [ 3 ]

もちろん要素数が 3 で中身が全部空っぽの配列を作りたい場面では Array(3) を使ってください。

その他の例

console.log(Array.of(11, 22, 33)); // => [ 11, 22, 33 ]
console.log(Array.of('1')); // => [ '1' ]

// undefinedの扱い
console.log(Array.of()); // => []
console.log(Array.of(undefined)); // => [ undefined ]

これで話はほぼ終わり

機能としてはそんなもんです。

この先仕様の細かい話をします。

継承

Array.of() は this をコンストラクターに用います。

どういうことかというと、 Array を継承した拡張配列コンストラクターを用意した場合に、元の Array ではなくそちらのインスタンスを生成することができるということです。

class SugoiArray extends Array {
}

const arr = SugoiArray.of(11, 22, 33);
console.log(arr instanceof SugoiArray); // => true

Array が継承可能である点については別稿で述べました。

というかいっそ継承していなくても構いません。

class SugoiObject {
}

const arr = Array.of.apply(SugoiObject, [3]);
console.log(arr);
// => SugoiObject { '0': 3, length: 1 }

配列風オブジェクトのできあがり。

Object で作ると Number になる！

じゃあただの配列風オブジェクトを作るぜーって Object を指定すると、なんと Number になってしまった。

const arr = Array.of.apply(Object, ['Hey']);
console.log(arr); // => { [Number: 1] '0': 'Hey', length: 1 }

console.log(arr instanceof Number); // => true
console.log(Object.prototype.toString.apply(arr)); // => '[object Number]'

誰だお前どこから出てきたんだ。

わかんないから質問しちゃった。

そしたら数分で答えが返ってきたんだけど、理由は、内部的に new Object(length) を実行しているため。 （ length はもちろん要素数。） そしてこの Object(123) は Number インスタンスを返す仕様なのでした。

た、たしかに～～～！

this がコンストラクターでない場合

は、自動的に普通の配列になります。

型付き配列の of()

処理内容はほとんど同じで継承も可能なんだけど、 this が型付き配列のコンストラクターでない場合 TypeError になります。

const arr = Uint8Array.of.apply(Array, ['3']);
// TypeError: Method %TypedArray%.of called on incompatible receiver [object Array]
// (Node.js v11.0.0)

内部で Array.of() を呼んでたりはしません。 似てるけど別の処理。

おしまい

そうは言っても「数値1つの配列を作りたい、でも配列記法 [] は使いたくない」みたいな場面てないよなあ。いつ使えば良いんだろ。

関連

参考