實例詳解javascript數組去重的幾個思路

資料去重的需求其實像是lodash這些工具庫已經有成熟完備的實現，並且可以成熟地運用於生產環境。但這並不妨礙我們從思維拓展的角度出發，看看去重可以用幾個想法去實現。本文主要和大家分享javascript數組去重的幾個想法。

首先是常規的雙層循環比對的思路實現

function doubleLoopUniq(arr) {
  let result = [];
  for (let i = 0, len = arr.length, isExist; i <p>借助js內建的indexOf 進行去重</p><pre class="brush:php;toolbar:false">function indexOfUniq(arr) {
  let result = [];
  for (let i = 0, len = arr.length; i <p>排序後前後比對去重</p># <pre class="brush:php;toolbar:false">function sortUniq(arr) {
  let result = [], last;
  // 这里解构是为了不对原数组产生副作用
  [ ...arr ].sort().forEach(item => {
    if (item != last) {
      result.push(item);
      last = item;
    }
  });
  return result;
}

透過hashTable去重

function hashUniq(arr) {
  let hashTable = arr.reduce((result, curr, index, array) => {
    result[curr] = true;
    return result;
  }, {})
  return Object.keys(hashTable).map(item => parseInt(item, 10));
}

ES6 SET一行程式碼實作去重

function toSetUniq(arr) {
  return Array.from(new Set(arr));
}

splice 去重（直接操作陣列本身，有副作用）

function inPlaceUniq(arr) {
  let idx = 0;
  while (idx <p>最後在nodejs下面簡單跑個測試，看看哪個效率高~</p><pre class="brush:php;toolbar:false">let data = [];
for (var i = 0; i <p>結果如下</p><pre class="brush:php;toolbar:false">hashTable 168ms
sortUniq 332ms
toSetUniq 80ms
indexOfUniq 4280ms
doubleLoopUniq 13303ms
inPlaceUniq 9977ms

---

延伸思考： 如果陣列內的元素是物件該怎麼重呢？

既然是引用類型，那麼不免會使用到deepEqual，固然這種想法可以解答這道問題，但難免不夠高效。

從上面的測試中也可見透過new Set 和 hashTable 去重是最高效的。
所以毫無疑問，我們要基於這兩種方式去改造，我想用的是hashTable，
另一方面，為了降低深度比較帶來的耗時，我嘗試用JSON.stringify 將引用類型轉換為基本類型。

function collectionUniq(collection) {
  let hashTable = {};
  collection.forEach(item => {
    hashTable[JSON.stringify(item)] = true;
  })
  return Object.keys(hashTable).map(item => JSON.parse(item))
}

那麼問題來了，我們都知道物件的屬性是無序的，假如資料是這種情況，那就GG了。

let collection = [ { a: 1, b: 2, c: 3 }, { b: 2, c: 3, a: 1 } ]

有一種toHash的思路，在對這個數組進行一次基本的去重之後，為了保證準確，
先遍歷JSON 字串=>
通過charCodeAt()拿到每個字串的unicode 編碼=>
相加得到一個總數，最後再兩兩進行比較，數值相等的就是重複的，這樣就達到去重的效果了。

function toHash(obj) {
  let power = 1;
  let res = 0;
  const string = JSON.stringify(obj, null, 2);
  for (let i = 0, l = string.length; i <p>這只是一個實現基本的思路，有很大的改進空間，為了減少hash碰撞的可能，可以對一些特殊字元進行權重的增減。 </p><p><strong>重點是保證碰撞的幾率小到比中大獎還小就可以了。 </strong></p><p class="comments-box-content">相關推薦：<br></p><p class="comments-box-content"><a href="http://www.php.cn/js-tutorial-386521.html" target="_self">JavaScript陣列去重的幾種方法分享</a></p><p class="comments-box-content"><a href="http://www.php.cn/php-weizijiaocheng-386230.html" target="_self">PHP實作陣列去重的方法代碼</a></p><p class="comments-box-content"><a href="http://www.php.cn/js-tutorial-384672.html" target="_self">JS簡單實作陣列去重的方法分析</a></p>#

以上是實例詳解javascript數組去重的幾個思路的詳細內容。更多資訊請關注PHP中文網其他相關文章！