數組去重的JavaScript實現

Imfan 發布于2019-08-20 15:23 / 3029人閱讀

摘要：主要用到數組的方法。第一種方式是判斷數組中的第一索引號等于參數索引號，一般來說，如果數組元素重復，除第一個元素外，所有重復元素的索引和該元素對應的第一索引是不同的。

1.最簡方法

創建一個空的新數組，依次檢查舊數組的值是否存在于新數組中，如果不存在就push進去。主要用到數組的indexOf方法。

            function arrUnique(arr){
                var newArr = [];
                for (i = 0; i < arr.length; i++){
                    if (newArr.indexOf(arr[i]) == -1){
                        newArr.push(arr[i]);
                    }
                }
                return newArr;
            }
            var arr = [1,2,3,4,5,3,2];
            console.log(arrUnique(arr));

2.對象屬性賦值1

通過將舊數組的值分別賦值給對象的屬性，由于對象屬性賦值時舊屬性會被新的同名屬性覆蓋，所以保證了數組（屬性）的單一性，最后通過for in將這些屬性push到新數組中。

        function arrUnique(arr){
            var obj = {};
            var newArr = [];
            arr.map(function(item){
                obj[item] = null;
            })
            for (var key in obj){
                newArr.push(Number(key));
            }
            return newArr;
        }
        var arr = [1,2,3,4,5,3,2];
        console.log(arrUnique(arr));

3 對象屬性賦值2

創建一個空數組和空對象，檢查舊數組的值是否作為對象的屬性存在，如果不存在就給這個對象添加數組值屬性，屬性值為1，并且把這個數組的值賦值給新數組。利用的原理還是對象屬性值會被覆蓋，也就是說是唯一的。下標的引用要比用indexOf搜索數組快的多，所以該方法方法2快。此處的對象其實是一個哈希表，雖然速度快很多，但是內存占用較大，也就是以空間換時間。

        function arrUnique(arr){
            var newArr = [];
            var obj = {};
            for (var i = 0; i < arr.length; i++){
                if (!obj[arr[i]]){
                    newArr.push(arr[i]);
                    obj[arr[i]]=1;
                }
            }
            return newArr;
        }
        var arr = [1,2,3,4,5,3,2];
        console.log(arrUnique(arr));

4 先使用數組的sort方法排序，節省空間且速度較快

先對原數組排序，然后判斷數組元素是否在新數組的最后一位，如果不是就push進去。這種方法比單純循環要快很多，雖然沒有哈希表方式快，但是不占用較大空間。

            function arrUnique(arr){
                arr.sort();//快排
                var newArr = [];
                for(var i = 0; i < arr.length; i++){
                    if (arr[i] !== newArr[newArr.length - 1]){
                        newArr.push(arr[i]);
                    }
                }
                return newArr;
            }
            var arr = [1,2,3,4,5,3,2];
            console.log(arrUnique(arr));

5 來自評論區的善意

昨天發布該文之后，今天收到評論區亦秋的反饋，給出了兩種很簡潔的ES6去重方式。
1）第一種方式是判斷數組中的第一索引號等于參數索引號，一般來說，如果數組元素重復，除第一個元素外，所有重復元素的索引和該元素對應的第一索引是不同的。該處第一索引是指自左向右搜索到的第一個元素的索引號。

[1,2,3,4,5,3,2].filter((value, index, array) => array.indexOf(value) === index)

2）通過ES6的Set數據結構，該結構類似于數組，但是不會出現重復元素，因此，只要基于原始數組創建Set結構，然后在數組內部展開就成了單一元素數組。

[...new Set([1,2,3,4,5,3,2])]

GPU云服務器云服務器數組去重數組去重二維數組去重 php數組去重

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/82200.html

JavaScript專題之數組去重

摘要：專題系列第三篇，講解各種數組去重方法，并且跟著寫一個前言數組去重方法老生常談，既然是常談，我也來談談。它類似于數組，但是成員的值都是唯一的，沒有重復的值。 JavaScript 專題系列第三篇，講解各種數組去重方法，并且跟著 underscore 寫一個 unique API 前言數組去重方法老生常談，既然是常談，我也來談談。雙層循環也許我們首先想到的是使用 indexOf 來循...

fsmStudy 2019-08-21 15:55 評論0 收藏0
javascript 數組去重的6種思路

摘要：但是這并不妨礙我們從思維拓展的角度出發，看看去重可以用幾種思路去實現。首先是常規的雙層循環比對的思路實現定義一個變量表示當前元素在中是否存在。依次對中的元素和原數組元素進行比對。重點是保證碰撞的幾率小到比中大獎還小就可以了。前端在日常開發中或多或少都會碰到有對數據去重的需求，實際上，像是lodash這些工具庫已經有成熟完備的實現，并且可以成熟地運用于生產環境。但是這并不妨礙我們從思維...

AlphaWallet 2019-08-26 11:39 評論0 收藏0
[Javascript]數組去重的三種實現方式

摘要：方式使用獲取并刪除刪除數組的第一個元素，判斷這個元素是否還存在于數組中，如果存在則說明這個元素的是重復的如果不存在，進行操作方式建立一個哈希表，通過對象屬性查詢去除重復元素方式思路和方式類似，但是簡潔很多來源個人博客方式1：使用shift()獲取并刪除刪除數組的第一個元素，判斷這個元素是否還存在于數組中，如果存在則說明這個元素的是重復的；如果不存在，進行push()操作 functi...

TZLLOG 2019-08-22 10:45 評論0 收藏0
JavaScript數組去重的總結

摘要：數組去重方法的總結前言在中數組是比較常用的，本文中總結了下數組去重的幾種常用方法，如有問題，請指正。 JavaScript數組去重方法的總結前言在JavaScript中數組是比較常用的，本文中總結了下數組去重的幾種常用方法，如有問題，請指正。簡單粗暴的一種，ES6中set方法： var arr = [1,2,2,3,3,4,5,5]; console.log([...new Se...

Tonny 2019-08-26 11:40 評論0 收藏0
JavaScript數組去重的6種算法

摘要：否則存入結果數組。否則存入結果數組排序后相鄰去除法雖然原生數組的方法排序結果不怎么靠譜，但在不注重順序的去重里該缺點毫無影響。實現思路給傳入數組排序，排序后相同值相鄰，然后遍歷時新數組只加入不與前一值重復的值。 1.遍歷數組法實現思路：新建一新數組，遍歷傳入數組，值不在新數組就加入該新數組中；注意點：判斷值是否在數組的方法indexOf是ECMAScript5 方法，IE8以下不支持...

Panda 2019-08-22 13:48 評論0 收藏0