JavaScript中的`from`方法详解：创建数组的多种技巧214

大家好，我是你们的知识博主！今天我们来深入探讨一下JavaScript中一个非常实用，却常常被忽略的方法——`from`方法。它主要用于创建新的数组实例，其功能强大且灵活，能处理各种数据类型和场景，远超我们通常所用的数组字面量`[]`或`Array()`构造函数。让我们一起揭开它的神秘面纱吧！

很多新手程序员习惯于使用数组字面量`[]`或`Array()`构造函数来创建数组。例如：`let arr = [1, 2, 3];` 或者 `let arr = new Array(1, 2, 3);`。这些方法简单直接，但在处理一些复杂情况时就会显得力不从心。而`()`方法则为我们提供了一种更优雅、更强大的数组创建方式。

`()`方法的语法十分简洁：

(iterable[, mapFn[, thisArg]]);

其中：
iterable：一个可迭代对象（例如数组、类数组对象、字符串、Set、Map等），或者是一个具有长度属性的对象。
mapFn：（可选）一个映射函数，为每个元素调用一次。它的参数是当前元素的值、索引和源数组。
thisArg：（可选）映射函数执行时的`this`值。

一、从可迭代对象创建数组：

`()`最常见的用途是从可迭代对象创建数组。这包括数组、字符串、NodeList、Arguments等。例如：

let arr1 = ([1, 2, 3]); // 创建一个新的数组 [1, 2, 3]

let str = "hello";

let arr2 = (str); // 创建一个数组 ['h', 'e', 'l', 'l', 'o']

let nodeList = ('p');

let arr3 = (nodeList); // 将NodeList转换为数组

二、使用映射函数进行转换：

`mapFn`参数允许我们对每个元素进行转换后再添加到新数组中。例如，我们将一个数组中的每个数字都平方：

let arr4 = ([1, 2, 3], (x) => x * x); // 创建一个数组 [1, 4, 9]

我们还可以使用索引和源数组：

let arr5 = ([1, 2, 3], (x, index, arr) => `${x} at index ${index} in ${arr}`); // 创建一个数组 ['1 at index 0 in 1,2,3', '2 at index 1 in 1,2,3', '3 at index 2 in 1,2,3']

三、从具有长度属性的对象创建数组：

`()` 甚至可以从具有`length`属性的对象创建数组，但这需要谨慎使用，因为其内部机制不同于迭代器。例如：

let obj = {length: 3, 0: 'a', 1: 'b', 2: 'c'};

let arr6 = (obj); // 创建一个数组 ['a', 'b', 'c']

需要注意的是，如果对象不包含数字索引的属性，则对应的数组元素将为`undefined`。例如：

let obj2 = {length: 3, 1: 'b', 2: 'c'};

let arr7 = (obj2); // 创建一个数组 [undefined, 'b', 'c']

四、`thisArg`参数的应用：

`thisArg`参数可以设置`mapFn`函数执行时的`this`值。这在需要在映射函数中使用对象方法时非常有用。例如：

let obj3 = {

prefix: 'Hello ',

map: function(x) { return + x; }