HiDocs
Search K

Appearance

一文搞懂 Array.from() ​

1.介绍 ​

Array.from() 是 JavaScript 中的一个内置方法，用于将可迭代对象（iterable）或类数组对象转换为真正的数组。它提供了一种简便的方式来从一组元素创建新的数组。可迭代对象包括字符串、数组、Set、Map、类数组对象等。

注意：Array.from 方法 完全等价于 []+…扩展运算符

在 JavaScript 中，有许多对象被认为是类数组对象，例如函数的 arguments 对象、DOM 节点集合（例如 document.getElementsByTagName('div') 的返回结果）等。这些对象具有数字索引，可以通过索引访问元素，并且通常具有 length 属性来表示元素的数量。

2.具体应用案例：创建一个 n*m 的填充数组 ​

js
const n = 10;
const dp = Array.from({ length: n }, () => Array(n).fill(false)); //n是确定的数字

const dp = Array.from({ length: n }, () => Array(n).fill(false)); 这行代码使用了 Array.from() 方法来创建一个二维数组 dp，并将其初始化为 n 行 n 列，初始值为 false。

  1. { length: n } 创建了一个具有 length 属性为 n 的对象，但没有数值索引**（实际上可以理解为一个类数组对象，它有 n 项，有一个属性为 length）**。这个对象将被传递给 Array.from()，作为要生成数组长度的基础。
  2. () => Array(n).fill(false) 是一个箭头函数，表示对每个索引位置的处理。在这里，它返回一个长度为 n 的一维数组，其中的每个元素都被填充为 false。
  3. Array.from({ length: n }, ...) 使用上述箭头函数生成了一个具有 n 行的二维数组。在这个过程中，Array.from() 会遍历类数组对象的索引从 0 到 n-1，并将每个索引位置的箭头函数执行结果作为数组的对应行。

new Array(n)和 Array(n)的区别？

new Array(n) 和 Array(n) 的结果是一样的：都会创建一个指定长度的数组，其中的元素都是 undefined

普通的对象可以通过 Array.from 转换为二维数组吗？

普通的对象不能直接通过 Array.from() 转换为二维数组。Array.from() 方法主要用于将类数组对象或可迭代对象转换为数组。

普通的对象可以通过 Object.entries(obj);方法，把自己变成一个二维数组，同时可以通过 Object.fromEntries(arr);转换回来！