前座問題
Q. (JavaScript)20 ~ 50 までの連番からなる配列arrを作成せよ。
真っ先に思い浮かんだやつ
const arr = []
for (let i = 20; i <= 50; i++) {
arr.push(i)
}
console.log(arr)
// arr=[20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50]
👶「...」
👶「なんかださい」
👶「一個ずつ入れるんじゃなくて、map関数みたいにできないものか」
(うまく言語化できなかったので雰囲気掴んでください)
本問題
Q. (JavaScript)20 ~ 50 までの連番からなる配列arrをスマートに作成せよ。
解答
(MDN引用)
// 連番の生成
// 配列はそれぞれの場所が `undefined` で初期化されるため、
// 以下の `v` の値は `undefined` になる
Array.from({ length: 5 }, (v, i) => i);
// [0, 1, 2, 3, 4]
これを元に考えた回答がこちら
const arr = Array.from({ length: 31 },(v,i) => i + 20)
すこし深掘り
👶「Array.from()かあ、あんま使ってないから調べよか」
構文
Array.from(arrayLike, mapFn)引数
arrayLike
配列に変換する反復可能オブジェクトまたは配列風オブジェクト。mapFn (省略可)
配列の各要素に対して呼び出す関数です。指定された場合、配列に追加されるすべての値は最初にこの関数に渡され、代わりに mapFn の返値が配列に追加されます。この関数は以下の引数で呼び出されます。element
配列内で現在処理中の要素です。index
配列内で現在処理中の要素のインデックスです。
👶「おい、待てぃ。arrayLikeに入った{length:5}の説明がないやん」
Array.from() は、以下のものから Array を生成します。
- 反復可能オブジェクト(Map や Set のような要素を取得するオブジェクト)
- オブジェクトが反復可能でない場合は、配列風オブジェクト(length プロパティおよび添字の付いた要素を持つオブジェクト)
👶「ほーん。今回は『length プロパティを持つ配列風オブジェクト』ってわけか」
const a = Array.from({length: 5})
console.log(a) //[undefined,undefined,undefined,undefined,undefined]
const b = Array.from({length: 5,2: 'hoge'})
console.log(b) //[undefined, undefined, 'hoge', undefined, undefined]
👶「なんとなくわかった」
おしまい