ECMAScript的`Array.from()`：将可迭代对象转换为数组的利器

在ECMAScript 2015（ES6）中，Array.from()方法为数组的创建提供了一种新的途径。这个方法可以将类数组对象或可迭代对象转换成一个新的、真正的数组。本文将详细探讨Array.from()的用途，并提供代码示例来展示其功能。

Array.from()方法简介

Array.from()方法接受一个可迭代或类数组对象作为参数，并返回一个由该对象的元素组成的新数组。

语法：

Array.from(arrayLike[, mapFn[, thisArg]])

• arrayLike：一个类数组对象。
• mapFn（可选）：一个映射函数，用于对每个元素进行处理。
• thisArg（可选）：映射函数的执行上下文。

用途和优势

1. 转换类数组对象：将具有length属性和整数索引的类数组对象转换为数组。
2. 转换可迭代对象：将可迭代对象（如Map、Set等）转换为数组。
3. 提供映射功能：在转换的同时，可以对元素进行处理。

代码示例

将类数组对象转换为数组

const arrayLike = { 0: 'a', 1: 'b', 2: 'c', length: 3 };
const arr = Array.from(arrayLike);
console.log(arr); // 输出：[ 'a', 'b', 'c' ]

将Map对象转换为数组

const map = new Map([['key1', 'value1'], ['key2', 'value2']]);
const arr = Array.from(map);
console.log(arr); // 输出：[ [ 'key1', 'value1' ], [ 'key2', 'value2' ] ]

将Set对象转换为数组

const set = new Set([1, 2, 3, 4, 5]);
const arr = Array.from(set);
console.log(arr); // 输出：[ 1, 2, 3, 4, 5 ]

使用映射功能

const arrayLike = { 0: 1, 1: 2, 2: 3, length: 3 };
const arr = Array.from(arrayLike, x => x * x);
console.log(arr); // 输出：[ 1, 4, 9 ]

结论

Array.from()方法是一个多功能的工具，它不仅可以将类数组对象和可迭代对象转换为数组，还可以在转换过程中对元素进行映射处理。这使得Array.from()成为ECMAScript中处理数组和类似数组结构的不可或缺的方法之一。通过使用Array.from()，开发者可以编写出更加简洁、灵活且功能强大的代码。