配列長が決まっている空の配列に対してmapとかforEachで操作する

for文を使いたくないイキりprototypeオタク向けの情報です。

空の配列は操作ができない

たとえば2の倍数の配列(0含む)を作りたい時

const array = [];
for(let i=0;i++;i<10) {
   array.push(i*2);
}

みたいなイケイケなコード、書きたくないですよね。

というわけで以下のようにprototypeを使ってみます。

const array = new Array(10); //長さ10の配列を作る
const array2 = array.map((value, index) => index*2); //10回分のなんか操作がしたい

これ動きません。　あくまでも配列長が決まっただけのArrayObjectということらしく、添字分の処理をしたいときに空の配列(empty)だと動かないみたいです。

空じゃなければ動く、ということは以下のように修正すると動きます。

const array = new Array(10);
array.fill(0); //0で埋める
const array2 = array.map( (value, index) => index*2); //何故か動く

・・・。　ツッコミたいですがここはぐっとこらえて。

イキりたい本質はメソッドチェーンなのでこう書く。

const array = new Array(10)
    .fill(0)
    .map( (obj, index) => index*2);

～～～～

おまけ

//chromeDEVToolのconsoleでポチポチしたときのログです
arr = new Array(10)
>(10) [empty × 10]
arr[2] = 3;
>3
arr
>(10) [empty × 2, 3, empty × 7]
arr.map((v,i)=>i*2);
>(10) [empty × 2, 4, empty × 7]

emptyは添字にカウントされません。JavaScriptは最高です、一生ついていきます。