「漏洞」真相：理解 JavaScript 的稀疏數組與意外行為

我最近正在溫習我的資料結構和演算法技能，特別是排序演算法；我發現自己處於一個有趣的境地。

如何建立長度為 n 的隨機陣列來測試我的排序演算法？你可能會說這很容易，確實如此。在你的腦海裡，你可能會想到這樣的事：

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

    for (let i = 0; i 



<p>這絕對按預期工作。但我一直在尋找更簡單的東西。最好是單線。嗯，我第一個想到的是使用 new Array()。 <br>
</p>

<pre class="brush:php;toolbar:false">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)
// []

[1, , , 3]
// [1, , 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中文網其他相關文章！