'漏洞”真相：理解 JavaScript 的稀疏数组和意外行为

我最近正在温习我的数据结构和算法技能，特别是排序算法；我发现自己处于一个有趣的境地。

如何创建长度为 n 的随机数组来测试我的排序算法？你可能会说这很容易，确实如此。在你的脑海里，你可能会想到这样的事情：

function randomArray(n) {
    const arrToReturn = [];

    for (let i = 0; i < n; i++) {
        arrToReturn.push(Math.floor(Math.random() * 10));
    }
    return arrToReturn;
}

这绝对按预期工作。但我一直在寻找更简单的东西。最好是单线。嗯，我第一个想到的是使用 new Array()。

const randomArray = (n) => new Array(n).map(() => Math.floor(Math.random() * 10));

console.log(randomArray(5))

您希望记录什么？

嗯，我期待它记录一个随机 5 个值的数组。如果你不是，那么干杯！你知道我要讨论什么:)

令我惊讶的是，事实并非如此。它将其记录在节点 20 中：
[ ]

嗯......令人费解！

有趣的是，console.log(randomArray(5).length) 记录了 5。

那么，为什么会发生这种情况呢？好吧，我们来谈谈 Javascript 中的稀疏数组！

稀疏数组

稀疏数组是包含一个或多个空槽的数组。例如：

new Array(2)
// [<2 empty items>]

[1, , , 3]
// [1, <2 empty items>, 3]

那么，这是如何工作的？

嗯，当你在 JS 中使用 new Array(5) 创建数组时，它会创建一个具有 5 个未初始化槽的数组。这意味着它们不包含任何东西；不为空，不为未定义。

好的，我明白了！但是你不能在这些“槽”上调用 .map 吗？

嗯，当你在稀疏数组上调用迭代方法，例如 forEach、map、reduce 和 filter 等时......，这些空槽将被跳过。

让我们再看看我们的函数 randomArray。

const randomArray = (n) => new Array(n).map(() => Math.floor(Math.random() * 10));

我们使用 new Array(n) 创建一个长度为 n 的数组，它返回一个稀疏数组 []。然后我们在该数组上调用 map 。由于所有槽位都是空的，所以它们都跳过了。因此，我们得到了结果！

为什么在稀疏数组上调用 .length 会返回一个值？

这是由于 .length 数组方法在 JS 中的实现方式造成的。为了获得长度值，我们取最大的索引并加 1。由于稀疏数组是有索引的，所以我们将获得预期的长度值。您可以在这里阅读更多内容。

让我们修复上面有问题的 randomArray 函数

由于稀疏数组包含空或未初始化的槽，因此不可迭代，我们可以通过用一些值填充这些槽来解决这个问题。我们可以通过使用 .fill 数组方法来实现：

const randomArray = (n) => new Array(n).fill().map(() => Math.floor(Math.random() * 10));

console.log(randomArray(5))

现在，我们可以出发了！

以上是'漏洞”真相：理解 JavaScript 的稀疏数组和意外行为的详细内容。更多信息请关注PHP中文网其他相关文章！