Henry's Blog

用 JavaScript 建立 1 到 N 的陣列

用 JavaScript 有幾種方法可以建立 [1, 2, 3, 4, ..., N] 的陣列

1. Array.from()

const n = 10
Array.from({ length: n }, (v, i) => i + 1)

Array.from 第一個參數可以放 array-like object(有 length 屬性的 object)或是 iterable objects(像是 MapSet),然後使用第二個參數的 map function 把 index 轉成 1...N 的數字。

2. Spread Operator

const n = 10

// first method
[...Array(n + 1).keys()].slice(1)

// second method
[...Array(n)].map((v, i) => i + 1)

為什麼是用 Array() 建立空陣列而不是 new Array() 呢? 根據文件所述: When Array is called as a function rather than as a constructor, it creates and initialises a new Array object. Thus the function call Array(…) is equivalent to the object creation expression new Array(…) with the same arguments. 也就是說,使用 Array() 或是 new Array() 建立新陣列都會是一樣的結果

3. while loop

這個方法是我第一次看到,據 StackOverflow 網友測試效率比其他兩種更好,我自己到 JSBench 去試的確比前兩種方法快很多。這位網友總共測試了 24 種方法,可以從 StackOverflow 頁面看測試了哪些。

const n = 10
const arr = Array(n) 
let i = 0
 
while(i < n) arr[i++] = i

以上就是幾種可以快速建立 1 ~ N 的陣列,當中我最喜歡第一種方法,雖然速度不是最快,但語意很清楚,也只需要一行而已。

Reference

  1. How to create an array containing 1…N
  2. Array() vs new Array()

#javascript