询问范围函数的说明

Question

代码如下：

const range = (start, stop) =>
 new Array(stop - start).fill(0).map((v, i) => start + i);

stop - start 的作用是什么？ （我猜是数组的长度但不确定，其实我改成加法了，一点影响都没有。）

.map((v,i)) 的参数有什么作用？

什么是参数“i”，如果我们一开始不打算使用它，为什么要传递“v”？

我知道 .fill() 用于填充数组的未定义索引，但再次对此进行解释也将不胜感激。

此函数获取 2 个给定参数之间的数字。

例子取自一本书，不是我写的。这本书是关于 FP 的。

Answer 1

我想你已经很好地理解了这个函数的大部分功能。我将首先分解它，然后解决 3 个单独的问题。

范围是什么：

1. 确定要返回多少个数字：(stop - start)
2. 创建一个该长度的数组：new Array(stop - start)
3. 用占位符值填充数组0：.fill(0)
4. 遍历数组以返回所需值的新数组：.map(...)

您的问题

stop - start 的作用是什么？ （我猜是数组的长度但不确定，其实我改成加法了，一点影响都没有。）

您的猜测是正确的，但您检查猜测的方式可能是错误的。 您可以在这里用加法代替减法的唯一情况是 start 等于 0。

一些例子：

• range(0, 2) -> [0, 1] -> 长度：2 - 0 = 2
• range(2, 5) -> [2, 3, 4] -> 长度：5 - 2 = 3

---

.map((v,i))的参数有什么作用？ 什么是参数“i”，如果我们一开始不打算使用它，为什么要传递“v”？

map method on an array 将三个参数传递给您传递给它的函数：

1. 数组的一个元素
2. 该值的索引
3. 整个数组

大多数时候，您只需要第一个元素。例如：

[1, 2, 3].map(v => v * v) // [2, 4, 9]

但在这种情况下，您实际上对 index 感兴趣，因为您可以使用它来创建一个将每个值递增 1 的范围。

[0, 0, 0].map((v, i) => i) // [0, 1, 2]

即使没有使用v，您也必须使用占位符才能使用第二个参数。

---

我知道 .fill() 用于填充数组的未定义索引，但再次对此进行解释也将不胜感激。

当您使用具有给定长度的Array 构造函数创建数组时，它将返回一个包含“孔”的数组。 map 会跳过这些漏洞。

要使用map，您首先必须填补漏洞。

其他例子：

这里有 2 个替代的 range 函数可能有助于说明我提出的一些观点。

const range1 = (start, stop) =>
 new Array(stop - start)
  // Fill with the lower value of the range
  .fill(start)
  // and increment by the index of every element
  .map((x, i) => x + i);
  
  
const range2 = (start, stop) => Array
   // Use Array.from
  .from(
    // Your array with "holes" can go here
    Array(stop - start),
    // You can now skip the `fill` part
    (_, i) => start + i
  );