ネットで見つけた方法は
どうやら下記コードで目的は達成できるらしい。
new Array(10).fill(0).map(() => 0)
// => [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
いったい、どうしてこうなるのか。
何が行われているのか？
new Array()
かっこの中に入れたLength分の配列を作成する。
つまりnew Array(10)であれば10個の値を含む配列を作成してくれる。
ちなみに値はundefinedになる
[undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined]
fill()
fill() メソッドは、開始位置（既定値は 0）から終了位置（既定値は array.length）までのすべての要素を、静的な値に変更した配列を返します。
つまり先ほど作った10個のundefinedを持つ配列のundefinedを0に変更してくれるということ？
console.log(new Array(10).fill(0))
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
ということらしい。
この時点でタイトル（n個の任意の値を持つ配列を作成する）という目的は達成されている。
いったいmap()は何をしているのか？
map()
このコードでいえばmap()は配列の個数分取り出して0を入れるという、まったく生産性のない動きをしている。
つまり本タイトルという目的を達成するためであれば、不要以外の何物でもない。
n個の任意の値を持つ配列を作成する方法
ということで結論は、
console.log(new Array(10).fill(0))
// [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
に落ち着いた。
map()が必要な場合は？
ちなみにmap()が必要な時は、必要とする値がオブジェクトの時らしい。
javascript fillでオブジェクトの配列を作成した際の注意点
上に詳しく説明されているけど、どうやら指定した個数分参照渡しされているということ。 つまり、3つの配列を作り、その2番目のkeyを変更しようとしたところ、すべてのkeyが変更される結果になる。
const v = new Array(3).fill({hello: 'Hello', world:'World'})
v[2].hello = 'goodbye'
console.log(v)
// [
// {
// "hello": "goodbye",
// "world": "World"
// },
// {
// "hello": "goodbye",
// "world": "World"
// },
// {
// "hello": "goodbye",
// "world": "World"
// }
// ]
そのため、mapで入れなおす必要がある。
念のためシンプルな個数分の配列で行ったけど、問題なかった。
const v = new Array(10).fill(0)
v[2] = 2
console.log(v)
// (10) [0, 0, 2, 0, 0, 0, 0, 0, 0, 0]
オブジェクトの時だけことは起こるらしい。