JavaScript中Set對(duì)象怎樣才能讓代碼更快

這篇文章主要介紹了JavaScript中Set對(duì)象怎樣才能讓代碼更快，具有一定借鑒價(jià)值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

我確信有很多開發(fā)人員堅(jiān)持使用基本的全局對(duì)象：數(shù)字，字符串，對(duì)象，數(shù)組和布爾值。對(duì)于許多用例，這些都是需要的。 但是如果想讓你的代碼盡可能快速和可擴(kuò)展，那么這些基本類型并不總是足夠好。

在本文中，我們將討論JS 中Set對(duì)象如何讓代碼更快—?特別擴(kuò)展性方便。 Array 和Set工作方式存在大量的交叉。但是使用Set會(huì)比Array在代碼運(yùn)行速度更有優(yōu)勢(shì)。

Set 有何不同

最根本的區(qū)別是數(shù)組是一個(gè)索引集合，這說(shuō)明數(shù)組中的數(shù)據(jù)值按索引排序。

const arr = [A, B, C, D];
console.log(arr.indexOf(A)); // Result: 0
console.log(arr.indexOf(C)); // Result: 2

相比之下，set是一個(gè)鍵的集合。set不使用索引，而是使用鍵對(duì)數(shù)據(jù)排序。set 中的元素按插入順序是可迭代的，它不能包含任何重復(fù)的數(shù)據(jù)。換句話說(shuō)，set中的每一項(xiàng)都必須是惟一的。

主要的好處是什么

set 相對(duì)于數(shù)組有幾個(gè)優(yōu)勢(shì)，特別是在運(yùn)行時(shí)間方面：

• 查看元素：使用indexOf()或includes()檢查數(shù)組中的項(xiàng)是否存在是比較慢的。
• 刪除元素：在Set中，可以根據(jù)每項(xiàng)的的 value 來(lái)刪除該項(xiàng)。在數(shù)組中，等價(jià)的方法是使用基于元素的索引的splice()。與前一點(diǎn)一樣，依賴于索引的速度很慢。
• 保存 NaN：不能使用indexOf()或 includes() 來(lái)查找值 NaN，而 Set 可以保存此值。
• 刪除重復(fù)項(xiàng)：Set對(duì)象只存儲(chǔ)惟一的值,如果不想有重復(fù)項(xiàng)存在，相對(duì)于數(shù)組的一個(gè)顯著優(yōu)勢(shì)，因?yàn)閿?shù)組需要額外的代碼來(lái)處理重復(fù)。

時(shí)間復(fù)雜度？

數(shù)組用來(lái)搜索元素的方法時(shí)間復(fù)雜度為0(N)。換句話說(shuō)，運(yùn)行時(shí)間的增長(zhǎng)速度與數(shù)據(jù)大小的增長(zhǎng)速度相同。

相比之下，Set用于搜索、刪除和插入元素的方法的時(shí)間復(fù)雜度都只有O(1)，這意味著數(shù)據(jù)的大小實(shí)際上與這些方法的運(yùn)行時(shí)間無(wú)關(guān)。

Set 究竟有多快？

雖然運(yùn)行時(shí)間可能會(huì)有很大差異，具體取決于所使用的系統(tǒng)，所提供數(shù)據(jù)的大小以及其他變量，但我希望我的測(cè)試結(jié)果能夠讓你真實(shí)地了解Set的速度。 我將分享三個(gè)簡(jiǎn)單的測(cè)試和我得到的結(jié)果。

準(zhǔn)備測(cè)試

在運(yùn)行任何測(cè)試之前，創(chuàng)建一個(gè)數(shù)組和一個(gè) Set，每個(gè)數(shù)組和 Set 都有100萬(wàn)個(gè)元素。為了簡(jiǎn)單起見(jiàn)，我從0開始，一直數(shù)到999999。

let arr = [], set = new Set(), n = 1000000;
for (let i = 0; i < n; i++) {
  arr.push(i);
  set.add(i);
}

測(cè)試1：查找元素

我們搜索數(shù)字123123

let result;
console.time('Array'); 
result = arr.indexOf(123123) !== -1; 
console.timeEnd('Array');
console.time('Set'); 
result = set.has(123123); 
console.timeEnd('Set');

• Array: 0.173ms
• Set: 0.023ms

Set 速度快了7.54倍

測(cè)試2：添加元素

console.time('Array'); 
arr.push(n);
console.timeEnd('Array');
console.time('Set'); 
set.add(n);
console.timeEnd('Set');

• Array: 0.018ms
• Set: 0.003ms

Set 速度快了6.73倍

測(cè)試3：刪除元素

最后，刪除一個(gè)元素，由于數(shù)組沒(méi)有內(nèi)置方法，首先先創(chuàng)建一個(gè)輔助函數(shù)：

const deleteFromArr = (arr, item) => {
  let index = arr.indexOf(item);
  return index !== -1 && arr.splice(index, 1);
};

這是測(cè)試的代碼：

console.time('Array'); 
deleteFromArr(arr, n);
console.timeEnd('Array');
console.time('Set'); 
set.delete(n);
console.timeEnd('Set');

• Array: 1.122ms
• Set: 0.015ms

Set 速度快了74.13倍

總的來(lái)說(shuō)，我們可以看到，使用Set 極大地改善運(yùn)行時(shí)間。再來(lái)看看一些Set有用的實(shí)際例子。

案例1:從數(shù)組中刪除重復(fù)的值

如果想快速地從數(shù)組中刪除重復(fù)的值，可以將其轉(zhuǎn)換為一個(gè) Set。這是迄今為止過(guò)濾惟一值最簡(jiǎn)潔的方法:

const duplicateCollection = ['A', 'B', 'B', 'C', 'D', 'B', 'C'];
// 將數(shù)組轉(zhuǎn)換為 Set
let uniqueCollection = new Set(duplicateCollection);
console.log(uniqueCollection) // Result: Set(4) {"A", "B", "C", "D"}
// 值保存在數(shù)組中
let uniqueCollection = [...new Set(duplicateCollection)];
console.log(uniqueCollection) // Result: ["A", "B", "C", "D"]

案例2：谷歌面試問(wèn)題

問(wèn)題：

給定一個(gè)整數(shù)無(wú)序數(shù)組和變量 sum，如果存在數(shù)組中任意兩項(xiàng)和使等于 sum 的值，則返回true。否則,返回false。例如，數(shù)組[3,5,1,4]和 sum = 9，函數(shù)應(yīng)該返回true，因?yàn)?code>4 + 5 = 9。

解答

解決這個(gè)問(wèn)題的一個(gè)很好的方法是遍歷數(shù)組，創(chuàng)建 Set保存相對(duì)差值。

當(dāng)我們遇到3時(shí)，我們可以把6加到Set中, 因?yàn)槲覀冎牢覀冃枰业?code>9的和。然后，每當(dāng)我們接觸到數(shù)組中的新值時(shí)，我們可以檢查它是否在 Set 中。當(dāng)遇到5時(shí)，在 Set 加上4。最后，當(dāng)我們最終遇到4時(shí)，可以在Set中找到它，就返回true。

const findSum = (arr, val) => {
  let searchValues = new Set();
  searchValues.add(val - arr[0]);
  for (let i = 1, length = arr.length; i < length; i++) {
    let searchVal = val - arr[i];
    if (searchValues.has(arr[i])) {
      return true;
    } else {
      searchValues.add(searchVal);
    }
  };
  return false;
};

簡(jiǎn)潔的版本：

const findSum = (arr, sum) =>
  arr.some((set => n => set.has(n) || !set.add(sum - n))(new Set));

因?yàn)?code>Set.prototype.has()的時(shí)間復(fù)雜度僅為O(1)，所以使用 Set 來(lái)代替數(shù)組，最終使整個(gè)解決方案的線性運(yùn)行時(shí)為O(N)。

如果使用 Array.prototype.indexOf()或Array.prototype.includes()，它們的時(shí)間復(fù)雜度都為 O(N)，則總運(yùn)行時(shí)間將為O(N2)，慢得多！

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享JavaScript中Set對(duì)象怎樣才能讓代碼更快內(nèi)容對(duì)大家有幫助，同時(shí)也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，遇到問(wèn)題就找億速云，詳細(xì)的解決方法等著你來(lái)學(xué)習(xí)!