數組去重的方法

sevi_stuo 發布于2019-08-20 16:09 / 1129人閱讀

摘要：因為使用多帶帶的接口存取數據所以不用擔心與內置屬性重名修改上面的方法后得到除了以外還有這種數據類型這是一個集合它不允許重復元素出現。

NaN

NaN屬于number,也是一種基本數據類型,只要有一邊是 NaN,那么結果就是false

原始值和包裝對象

包裝對象即基本數據類型經過包裝之后得到的對象,作為基本類型值的字符串擁有trim等方法,及length屬性,正是由于JS代碼會對原始值做一次包裝,然后變為了字符串對象,再執行相關的操作。

    // "a".trim();
    
    //該過程在JS解析過程中真實存在
    var tmp = new String("a");
    tmp.trim();

原始值和包裝對象的區別在于類型不同。這是最根本的區別,而且雖然是包裝"對象",但也會有對象的少部分特性,比如:

    var A = new String("a");
    var B = new String("a");
    var C = "a";
    A == B //false
    A == C //true

對象和對象

對象可以分為三種：純對象(plain object)、實例對象、其他類型的對象。

 純對象指由字面量生成,成員中不含函數和日期、正則表達式等類型的對象。

純對象

一元操作符會對對象隱式轉換,對象會先調用valueOf方法,然后是toString方法,直到能轉換為基本數據類型為止。

而判斷兩個對象是不是相等時,因為對象保存在堆內存,只有兩個對象引用同一個地址,才會相等：

    {} == {}//false
    var a = new Object();
    var b = a;
    console.log(a == b)

如果需要比較兩個對象的鍵名鍵值對是否相等,可以采取JSON.stringify的方法轉換后再比較。

實例對象

通過構造函數生成的對象,這樣的對象和純對象一樣無法直接進行外部比較是否相等,可以使用構造函數(類)提供靜態方法或實例方法來判斷是否相等。

其他對象

指的數組、日期、正則表達式等Object衍生出來的對象,一般需要根據使用場景來構造判斷方法,決定兩個對象是否相等。

例如日期對象要通過Data.prototype.getTime()方法來獲取時間戳判斷是否表示同一個時刻,正則需要toString獲取原始字面量來判斷是否是相同的正則表達式。

== 和 ===

如果判斷元素是否相等的方法中,采用的是==比較運算,兩邊的數據會發生隱式類型轉換,這就造成了影響判斷結果的因素。

在判斷Boolea、Number、String三種類型進行不同類型的 == 比較時,規則是將其轉化為數字之后再比較是否相等。

    console.log( "ac" == true )//false
    console.log(123 == "123");//true

而undefined表示"缺少值",就是此處應該有一個值,但是還沒有定義。它會被轉換成數字,而轉換結果為NaN,NaN不等于任何值,所以undefined != false;對于null來說,null表示"沒有對象"，即該處不應該有值。首先調用Object.valueOf方法返回基本類型值之后在比較,所以null != false
最后一點是undefined == null,這是ECMA-262標準 11.9.3 節的規定。

去重的方法 Array.prototype.indexOf()

    let arr = [12,12,9,2,0,9,8];
    /*
        例如:12第一次出現在0,之后再出現時index為1,
        說明第二個是重復值,所以只返回第一個12,
        但是對于NaN而言indexOf只會為-1,所以不管有幾個NaN都會直接跳過
    */
    function unique(arr){
        return arr.filter(function(value,index){
            return arr.indexOf(value) === index;
        })
    }
    
    //indexOf(NaN)則一直為-1,數組中會出現一個或多個NaN(如果存在)
    function unique(arr){
        let ret = [];
        arr.forEach(function(value){
            if(ret.indexOf(value) === -1){
                ret.push(value);
            }
        })
        return ret;
    }
    console.log(unique(arr));

在規范中,indexOf()使用的是全等比較,只要有NaN都是無法判斷位置直接跳過的。

    全等比較不能處理NaN的相等性判斷,NaN不等于任何值,包括本身。

Array.prototype.includes()

Array.prototype.includes()是ES6中新增的方法,判斷數組中是否包含某個元素,上一中indexOf方法可以修改為：

    function unique(arr){
        let ret = [];
        arr.forEach(function(value){
            if(!ret.includes(value)){
                ret.push(value);
            }
        })
        return ret;
    }

includes()方法內部的比較方法是:"SameValueZero",詳細規則:

    1. If Type(x) is different from Type(y), return false.

    2. If Type(x) is Number,then
    
        a. If x is NaN and y is NaN, return true.
        
        b. If x is +0 and y is -0, return true.
        
        c. If x is -0 and y is +0, return true.
        
        d. If x is the same Number value as y, return true.
        
        e. Return false.
    
    3. Return SameValueNonNumber(x, y).

注意:如果x、y都是NaN,則返回true,所以includes方法可以判斷是否包含了NaN

    var arr = [12,1,"d3",NaN];
    console.log(arr.includes(NaN));//true

由此可見indexOf和includes方法對NaN待的行為不一樣。

其他的方法

遍歷

遍歷是最基本也是最容易想到的方案:

    function unique(arr){
        let isRepeate;
        let ret = [];
        for(var i = 0;len = arr.length,i
去重的部分也是全等操作符實現的,所以對于數組中的NaN而言也會都push進入ret之后返回。
Map Key
Map是一種新的數據類型,就是key的類型沒有限制的對象,它的存取使用多帶帶的get、set接口。因為使用多帶帶的接口存取數據,所以不用擔心key與內置屬性重名,修改上面的方法后得到：
    function unique(arr){
        let ret = [];
        let len = arr.length;
        let tmp = new Map();
        for(let i = 0;i
set
除了Map以外,還有Set這種數據類型,這是一個集合,它不允許重復元素出現。
如果重復添加相同的元素,只會儲存其中的一個,包括NaN在內。如果將這種特性與數組交換,那么數組就可以直接去重了。
    function unique(arr){
        let ret = new Set(arr);
        return Array.from(set);
    }

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

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

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

JavaScript專題之數組去重

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

fsmStudy 2019-08-21 15:55 評論0 收藏0
JS數組去重總結

摘要：數組去重，一般會在面試的時候才會碰到，要求手寫數組去重方法的代碼。在實際項目中碰到的數組去重，一般都是后臺去處理，很少讓前端處理數組去重。數組去重的方法一利用去重中最常用如果不考慮兼容性，這種去重的方法代碼最少。數組去重，一般會在面試的時候才會碰到，要求手寫數組去重方法的代碼。如果是被提問到，數組去重的方法有哪些？你能答出其中的10種，面試官很有可能對你刮目相看。在實際項目中碰到的...

whinc 2019-08-02 16:09 評論0 收藏0
<javaScript> 數組去重的方法總結(2017年)

摘要：現在要求去重下面這個數組測試重復重復方法一測試重復重復去重后測試重復是新加的集合集合中的值不會重復。歡迎大家一起討論提出新的去重方法。有任何錯誤請在評論指出。現在要求去重下面這個數組 [1, 2, 3, 3, 3, 0, 1, 2, 測試, 重復, 重復, NaN, NaN, false, false]; 方法一：ES6 Set() let arr = [1, 2, 3, 3, 3,...

hightopo 2019-08-20 16:32 評論0 收藏0
<javaScript> 數組去重的方法總結(2017年)

摘要：現在要求去重下面這個數組測試重復重復方法一測試重復重復去重后測試重復是新加的集合集合中的值不會重復。歡迎大家一起討論提出新的去重方法。有任何錯誤請在評論指出。現在要求去重下面這個數組 [1, 2, 3, 3, 3, 0, 1, 2, 測試, 重復, 重復, NaN, NaN, false, false]; 方法一：ES6 Set() let arr = [1, 2, 3, 3, 3,...

YanceyOfficial 2019-08-01 16:50 評論0 收藏0
JavaScript數組去重（12種方法，史上最全）

摘要：數組去重，一般都是在面試的時候才會碰到，一般是要求手寫數組去重方法的代碼。如果是被提問到，數組去重的方法有哪些你能答出其中的種，面試官很有可能對你刮目相看。數組去重的方法一利用去重中最常用不考慮兼容性，這種去重的方法代碼最少。數組去重，一般都是在面試的時候才會碰到，一般是要求手寫數組去重方法的代碼。如果是被提問到，數組去重的方法有哪些？你能答出其中的10種，面試官很有可能對你刮目相看...

rozbo 2019-08-23 12:01 評論0 收藏0