Question

我无法理解以下代码的工作原理。当我尝试打印v的值时，我undefined的时间与length相同。

Array.from({length: 5}, (v, i) => i);
// [0, 1, 2, 3, 4]

尝试过的代码：

console.log(Array.from({length: 3}, function(v,i) {
    console.log(v);
    console.log(i);
    return i;

}));

Answer 1

引用docs：

Array.from()有一个可选参数mapFn，允许您这样做   对数组（或子类）的每个元素执行map函数   正在创建的对象）。

更清楚的是，Array.from(obj, mapFn, thisArg)与Array.from(obj).map(mapFn, thisArg)的结果相同，只是它没有创建中间数组。

现在，让我们分别检查每个部分。 Array.from({length: 5})评估为...

[undefined, undefined, undefined, undefined, undefined]

standard中有详细说明。简而言之，结果是具有相同length值的常规数组，将每个连续元素（从0到length-1）设置为某个值 - 从参数对象中获取，或者undefined如果没有（例如在您的情况下）。

现在，这样写的地图函数：

(v, i) => i

...忽略（使用它的数组）的值，只返回索引，每个元素一个。因此，映射转换实际上创建了一个数组，其中每个元素都等于其索引 - [0, 1, 2, ...]。

Answer 2

当你为它提供一个映射函数时，Array.from的工作方式是遍历你传递它的类似数组的东西，并为你的映射函数提供索引0,1处的属性值，等等我们的v（以及索引本身为i）所以函数可以映射它们。

非常松散地使用这些参数，它会这样做：

function sortOfLikeArrayFrom(arrayLike, mapFunc) {
    const a = [];
    for (let index = 0; index < arrayLike.length; ++index) {
        a[index] = mapFunc(arrayLike[index]);
    }
    return a;
}

由于您传入的对象没有0，1等属性，arrayLike[index]会向我们提供undefined，这就是传递的内容你的映射函数。

[再次，以上非常宽松，并根据您在问题中调用的论据量身定制;请参阅链接文章以获得完整实施（＆＃34; polyfill＆＃34;）。]

请注意，如果我们执行拥有其中一个属性，会发生什么：

＆＃13;

Array.from({length: 5, 1: "one"}, (v, i) => {
  console.log(`Index ${i}, value ${v}`);
  return v;
});

＆＃13;

我们看到"one"索引1，因为该对象具有该属性。

Answer 3

您应该通过阅读Array.from()方法的文档来取消所有内容。

它需要一个“类似数组”的对象并从中创建一个数组。在你的情况下，length是一个类似数组的对象（它不是一个数组，但它有Array.from({ length: 5 })属性，使它看起来像一个数组。）

因此在运行Array.from()之后，您将得到一个包含五个未定义元素的数组。

{{1}}的第二个参数是一个map函数。此函数适用于数组的每个元素。在您的示例中，此函数只接受元素的索引并返回它。所以你得到一个包含五个元素的数组，其中每个元素都是它在这个数组中的索引。

从包含length属性的对象创建数组

3 个答案: