ECMAScript 2016 正式引入了 Array.from 方法，它提供了一种简单、清晰和可维护的方式来生成新的数组。在 JavaScript 开发中，我们通常需要从现有的数组、类数组对象、集合或迭代器中创建数组。以前，我们可以使用 .split()、.slice()、.concat() 和 .apply() 等传统方法来解决这个问题。但这些方法通常会造成代码复杂度增加，而 Array.from 方法则能够解决这个问题。
Array.from 方法的优势
在介绍 Array.from 方法的使用方法之前，让我们先来看看它的优势：
- 简洁清晰：Array.from 方法的表现形式简练，不会让人感到混乱，代码可读性更高；
- 易于维护：Array.from 方法的实现使用更简单，不利于出现代码逻辑错误；
- 支持类数组：Array.from 方法能够将类数组对象转换为数组对象，比如 DOM 元素；
- 支持迭代器：Array.from 方法能够将迭代器转换为数组对象。
在 JavaScript 开发过程中，我们通常会用到数组，所以会有一些涉及到数组的操作。以前我们通常会使用传统的方法实现，但它们通常会增加代码复杂度，而 Array.from 方法则能够为我们解决这个问题。
Array.from 方法的使用
现在让我们来看一下 Array.from 方法的使用方法。Array.from 方法的第一个参数是一个伪数组对象或可迭代对象。
Array.from(arrayLike[, mapFn[, thisArg]])
其中，第一个参数 arrayLike 指的是要转换为数组的对象。它可以是一个伪数组对象或可迭代对象等。我们可以从 arrayLike 中提取需要的数据来得到一个新的数组对象。第二个参数 mapFn 表示用于对数组中每个元素进行处理的映射函数，可选的。第三个参数 thisArg 表示执行 mapFn 函数时的上下文，可选的。
下面是一些使用 Array.from 方法的示例：
-- -------------------- ---- ------- -- ------------- ----- --- - ------ ------- ----- --- - ---------------- ----------------- -- ----- ---- ---- ---- ---- - -- ---- ---- ---- ---- ---- -- --------------- ----- --- - - -- ---- -- ---- -- ---- ------- - -- ----- ---------- - ---------------- ------------------------ -- ----- ---- ---- -- -- ----- --------------- ----- ------ - --- -- --- ----- ------------ - ------------------ --- -- --- - --- -------------------------- -- --- -- --
总结
在 JavaScript 开发中，我们经常需要对数组进行操作。以前我们通常会使用传统的方法实现，但它们通常会增加代码复杂度，而 Array.from 方法则能够为我们解决这个问题。使用 Array.from 方法可以让我们的代码更加简洁、清晰和易于维护，同时还支持类数组对象和迭代器。如果您还没有尝试过使用 Array.from 方法，不妨在以后的开发中使用它，以获得更好的代码可读性和维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64e8709ff6b2d6eab33f97bf