JavaScript Array.from()用法及代碼示例

用法:

Array.from(arraylike, mapFunc, thisArg)

from() 方法是靜態方法，使用Array 類名調用。

from()參數

from() 方法包含：

• arraylike - Array-like 或要轉換為數組的可迭代對象。
• mapFunc(可選)- 在每個元素上調用的映射函數。
• thisArg(可選)- 執行 mapFunc 時用作 this 的值。

注意：Array.from(obj, mapFunc, thisArg)相當於Array.from(obj).map(mapFunc, thisArg).

from() 的返回值

• 返回一個新的 Array 實例。

示例 1：使用 from() 方法

// Array from String
let arr1 = Array.from("abc");
console.log(arr1); // [ 'a', 'b', 'c' ]

// Array from Map
let mapper = new Map([
  ["1", "a"],
  ["2", "b"],
]);

let arr2 = Array.from(mapper);
console.log(arr2); // [ [ '1', 'a' ], [ '2', 'b' ] ]

let arr3 = Array.from(mapper.keys());
console.log(arr3); // [ '1', '2' ]

// Array from Set
let set = new Set(["JavaScript", "Python", "Go"]);
let arr4 = Array.from(set);
console.log(arr4); // [ 'JavaScript', 'Python', 'Go' ]

輸出

[ 'a', 'b', 'c' ]
[ [ '1', 'a' ], [ '2', 'b' ] ]
[ '1', '2' ]
[ 'JavaScript', 'Python', 'Go' ]

這也適用於其他可迭代對象。

示例 2：將 from() 方法與 mapFunc 一起使用

function createArr(arraylike, mapFunc) {
  return Array.from(arraylike, mapFunc);
}

// using arrow function for mapFunc
let arr1 = createArr("123456", (x) => 2 * x);
console.log(arr1); // [ 2, 4, 6, 8, 10, 12 ]

輸出

[ 2, 4, 6, 8, 10, 12 ]