有時,在建立應用程式時,效能最終成為關鍵或至少是重要的驅動因素,特別是在處理大型資料集或即時要求時。 JavaScript 中最常見的任務之一是檢查集合中是否存在某個值。最常用的兩個替代方法是 Array.includes() 和 Set.has()。兩者都有效,但實際上,Set.has() 比 Array.includes 效果更好。讓我們深入探討原因,並決定何時應該使用任何替代方案。
有兩個方法看起來用法相當簡單,但實作不同,即 Array.includes() 和 Set.has()。
Array.includes()
includes() 方法檢查陣列中是否存在給定值。
它利用了 O(n) 的時間複雜度,使得陣列長度越大,檢查數值所需的時間就越長。
這是因為 Array.includes() 從頭到尾搜尋陣列(或直到找到值),陣列越大,花費的時間越長。
Set.has()
Set 的 has() 方法也會檢查給定值是否存在,但速度快得多。
Set.has() 依賴基於雜湊表的結構,該結構允許恆定時間查找,或 O(1) 時間複雜度。
與陣列不同,集合是為處理唯一值而建構的,因此它內部不會有重複的值,並且具有更多的查找時間。
當您使用 Set.has() 時,JavaScript 可以透過一次直接操作找到該項目,無論集合中有多少項目。例如,在檢查某個值是否在包含一百萬的集合中時,Set.has() 消耗的時間將與檢查十完全相同。
另一方面,Array.includes() 從左到右順序檢查每個元素,直到找到感興趣的項目或到達其末尾。這意味著它的尺寸越長,檢查時間就越長,特別是在項目接近尾部的情況下,而且肯定是當有問題的項目不存在時。
以下是一個詳細的例子:
const bigArray = Array.from({ length: 1000000 }, (_, i) => i); const bigSet = new Set(bigArray); const valueToFind = 999999; // Array.includes (O(n)) - Slower for large arrays console.time("Array.includes"); bigArray.includes(valueToFind); console.timeEnd("Array.includes"); // Set.has (O(1)) - Faster for large sets console.time("Set.has"); bigSet.has(valueToFind); console.timeEnd("Set.has");
當您執行此指令時,您會發現 Set.has() 在大型陣列上的效能遠遠優於 Array.includes()。實際上,這種差異很可能會轉化為更流暢的動畫、更快的載入時間,甚至更少的伺服器資源使用。
這一切都取決於您想要實現的目標。簡單總結如下:
使用 Set.has() 如果:
使用 Array.includes() 如果:
假設您正在實作一個使用者搜尋功能,根據封鎖的單字清單過濾名稱。如果您有數百個被封鎖的單字並且經常搜索,則對被封鎖的單字使用集合可以使每次搜尋檢查更快:
const bigArray = Array.from({ length: 1000000 }, (_, i) => i); const bigSet = new Set(bigArray); const valueToFind = 999999; // Array.includes (O(n)) - Slower for large arrays console.time("Array.includes"); bigArray.includes(valueToFind); console.timeEnd("Array.includes"); // Set.has (O(1)) - Faster for large sets console.time("Set.has"); bigSet.has(valueToFind); console.timeEnd("Set.has");
即使在較小的情況下,Set 也有助於保持事情的高效性和可預測性。另外,如果封鎖的單字清單成長,您就已經擁有了一個可擴展的解決方案。
效能:Set.has() 提供O(1) 時間複雜度,對於較大的集合來說,它比Array.includes() (O(n)) 快得多
適用性:集合是為唯一值而設計的,因此它自然地針對查找進行了最佳化。陣列對於重複值更靈活,但在檢查是否存在時速度較慢。
可擴充性:隨著資料的成長,Set.has() 繼續表現良好,而 Array.includes() 會變慢。
在 Set.has() 和 Array.includes() 之間進行選擇時,了解資料集的大小和性質始終很重要。 Array.includes() 非常適合小型資料集,但 Set.has() 在速度至關重要的情況下是一個寶貴的工具。正確的資料結構可以幫助優化您的 JavaScript 應用程序,使其更快、更有效率,而無需對程式碼進行重大更改。
因此,每當你發現自己在檢查某個東西是否存在時,你應該問自己:這是數組的工作,還是我可以使用集合的力量?正確處理很可能就是您的應用程式所需要的不同。
以上是為什麼 Set.has() 查找項目比 Array.includes() 更快的詳細內容。更多資訊請關注PHP中文網其他相關文章!