成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

淺談Javascript數(shù)組去重

Taste / 343人閱讀

摘要：總結(jié)，其實(shí)數(shù)組去重?zé)o非就是判斷一個(gè)元素在數(shù)組中是否有重復(fù)的值。參考自從數(shù)組去重談性能優(yōu)化也談數(shù)組去重?cái)?shù)組去重謝謝飛的更高指出的問題同步于個(gè)人博客

javascript 數(shù)組 array 去重 distinct unique

剛好前天面試的時(shí)候面試官問到了數(shù)組去重的問題，當(dāng)時(shí)有點(diǎn)語(yǔ)塞只想到用了兩個(gè)循環(huán)檢測(cè)（其實(shí)模模糊糊想到了hash的方法做但是由于記得不清不敢說= =！），思路是檢測(cè)是否有元素重復(fù)，然后將只出現(xiàn)一次的元素推入到新數(shù)組中，然后返回新數(shù)組。然后面試官又問這種方法的時(shí)間效率，于是黑線了。so這兩天看了一下相關(guān)的文章，在這里也總結(jié)一下javascript數(shù)組去重的方法。

兩層循環(huán)檢測(cè)重復(fù)元素法

首先，介紹一下大家都會(huì)想到的兩層循環(huán)的demo，如下例：

function distinct(arr) {
    var ret = [],
        length = arr.length;
    for(var i = 0;i < length; i++){
        for(j = i+1; j


如上的代碼實(shí)現(xiàn)是輕松易得的，思路如下：



首先外層循環(huán)比遍歷整個(gè)數(shù)組




內(nèi)層循環(huán)匹配是否有值重復(fù)


a.如判斷有相同元素則自增i變量，跳出i的循環(huán)
b.如判斷無時(shí)則將無相等值的元素推入到ret數(shù)組中


3.返回ret。





優(yōu)點(diǎn)：便捷易懂，大多數(shù)程序員能想到。
缺點(diǎn)：很明顯時(shí)間消耗太高，兩層循環(huán)時(shí)間消耗太多，時(shí)間的消耗為O(n^2^)，在進(jìn)行大量數(shù)據(jù)處理時(shí)會(huì)消耗大量資源。而且該方法無法處理字符和數(shù)組，如下例:


var arr = [1,23,4,5,6,7,"1",22,3,1,2];
distinct(arr);                  //返回[23, 4, 5, 6, 7, "1", 22, 3, 1, 2]



所以我們可以開始考慮一些別的方法優(yōu)化數(shù)組去重：

sort重排數(shù)組去除重復(fù)元素索引法(!每一個(gè)瀏覽器中的sort函數(shù)的排序方法并不一樣，所以實(shí)現(xiàn)結(jié)果可能會(huì)有差異，經(jīng)測(cè)試在chrome下測(cè)試別的數(shù)組實(shí)現(xiàn)會(huì)出現(xiàn)問題）

這種方法就是先講原數(shù)組使用sort方法將數(shù)組重排，以得到將相同元素為相鄰位的一個(gè)新數(shù)組。該方法如下：


function distinct(arr){
    var self = arr;
        list = self.concat().sort();
        
    list.sort(function(a, b){
        if(a === b){
            var ind = self.indexOf(a);
            self.splice(ind, 1);
        }
    });
    return self;
}
var arra = [1,2,3,3,1,1,1,"1"];
var arr = distinct(arra);                //返回的數(shù)組為[2,3,1,"1"]


同樣的，在使用這種方法的重排的時(shí)候，仍然會(huì)有一定的資源消耗，在sort()函數(shù)中回調(diào)函數(shù)是使用的冒泡排序，而冒泡排序的效率并不高。但是使用這種方法的效率仍然比上一種方法的效率高，因?yàn)樵诖死兄怀霈F(xiàn)了一次循環(huán)遍歷。


優(yōu)點(diǎn)：程序簡(jiǎn)潔，效率較高。
缺點(diǎn)：1.仍然無法解決數(shù)字1和字符"1"的去除。2.依賴indexOf方法，我們知道在IE6~8中并未支持indexOf()方法。
所以我們還要做一些兼容性的處理。如下:


var indexOf = [].indexOf ?
    function indexOf(arr, item){
        return arr.indexOf(item);
    }:
    function indexOf(arr, item){
        for(var i = 0; i < arr.length; i++){
            if(arr[i] === item){
                retrun i;            
            }
        }
        return -1;
    }
    
function distinct(arr){
    var self = arr;
        list = self.concat().sort();
        
    list.sort(function(a, b){
        if(a === b){
            var ind = self.indexOf(arr, a);
            self.splice(ind, 1);
        }
    });
    return self;
}    


將數(shù)組元素值存為對(duì)象的屬性

function distinct(arr) {
    var ret = [],
        json = {},
        length = arr.length;
        
    for(var i = 0; i < length; i++){
        var val = arr[i];
        if(!json[val]){
            json[val] = 1;
            ret.push(val);
        }
    }
    return ret;
}

var arra = [1,2,3,5,7,1,2,"1"];


以上方法更加的簡(jiǎn)潔，而且也能在原來的基礎(chǔ)上區(qū)分字符‘1’和數(shù)字1的區(qū)別。
在此例中思路如下：
1.循環(huán)遍歷每一個(gè)元素
2.檢測(cè)在json對(duì)象中是否含遍歷到的元素的值


a: 如果是則跳過
b: 如果否存入json對(duì)象中該屬性名的值設(shè)為1


3.將存入對(duì)象了元素的值推入到新數(shù)組中，返回新數(shù)組。


總結(jié)，其實(shí)數(shù)組去重?zé)o非就是判斷一個(gè)元素在數(shù)組中是否有重復(fù)的值。優(yōu)化也是一直改變判定元素是否重復(fù)的一些技巧，如例1中是遍歷數(shù)組，例2是重排數(shù)組獲得索引，例3則別出心裁將元素的值作為對(duì)象的屬性。


參考自：


從 JavaScript 數(shù)組去重談性能優(yōu)化


也談javascript數(shù)組去重


js數(shù)組去重

謝謝@飛的更高 指出的問題

同步于個(gè)人博客：http://penouc.com

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/78122.html

相關(guān)文章

  • 淺談JS中 reduce() 的用法

    摘要：一語(yǔ)法其中，表示將要原數(shù)組表示上一次調(diào)用回調(diào)時(shí)的返回值，或者初始值表示當(dāng)前正在處理的數(shù)組元素表示當(dāng)前正在處理的數(shù)組元素的索引，若提供值，則索引為，否則索引為表示初始值。 一、語(yǔ)法 arr.reduce(function(prev,cur,index,arr){...}, init); 其中，arr 表示將要原數(shù)組；prev 表示上一次調(diào)用回調(diào)時(shí)的返回值，或者初始值 init;cur 表...

    gplane 評(píng)論0 收藏0

  • 再見，重復(fù)的你（數(shù)組去重）

    摘要：前言昨天跟在前端好友聊天時(shí)，她提到了一個(gè)問題數(shù)組去重你會(huì)怎么寫。利用將結(jié)構(gòu)轉(zhuǎn)換成數(shù)組拓展運(yùn)算符內(nèi)部使用循環(huán)參考淺談數(shù)組去重?cái)?shù)組去重小結(jié)標(biāo)準(zhǔn)入門第版 前言 昨天跟在前端好友聊天時(shí)，她提到了一個(gè)問題：數(shù)組去重你會(huì)怎么寫？。想了想，其實(shí)有好幾種方法，決定在這篇筆記中做一些記錄。 思路一： 雙層循環(huán)，外層循環(huán)元素，內(nèi)層循環(huán)時(shí)比較值 如果有相同的值則跳過，不相同則push進(jìn)數(shù)組 Array....

    EsgynChina 評(píng)論0 收藏0

  • JS程序

    摘要：設(shè)計(jì)模式是以面向?qū)ο缶幊虨榛A(chǔ)的，的面向?qū)ο缶幊毯蛡鹘y(tǒng)的的面向?qū)ο缶幊逃行┎顒e，這讓我一開始接觸的時(shí)候感到十分痛苦，但是這只能靠自己慢慢積累慢慢思考。想繼續(xù)了解設(shè)計(jì)模式必須要先搞懂面向?qū)ο缶幊蹋駝t只會(huì)讓你自己更痛苦。 JavaScript 中的構(gòu)造函數(shù) 學(xué)習(xí)總結(jié)。知識(shí)只有分享才有存在的意義。 是時(shí)候替換你的 for 循環(huán)大法了~ 《小分享》JavaScript中數(shù)組的那些迭代方法~ ...

    melody_lql 評(píng)論0 收藏0

  • JavasScript重難點(diǎn)知識(shí)

    摘要：忍者級(jí)別的函數(shù)操作對(duì)于什么是匿名函數(shù)，這里就不做過多介紹了。我們需要知道的是，對(duì)于而言，匿名函數(shù)是一個(gè)很重要且具有邏輯性的特性。通常，匿名函數(shù)的使用情況是創(chuàng)建一個(gè)供以后使用的函數(shù)。 JS 中的遞歸 遞歸, 遞歸基礎(chǔ), 斐波那契數(shù)列, 使用遞歸方式深拷貝, 自定義事件添加 這一次，徹底弄懂 JavaScript 執(zhí)行機(jī)制 本文的目的就是要保證你徹底弄懂javascript的執(zhí)行機(jī)制，如果...

    forsigner 評(píng)論0 收藏0

  • ES6常用語(yǔ)法到Node淺談

    摘要：是解釋性語(yǔ)言因服務(wù)端的應(yīng)用，而貫通了前后臺(tái)。關(guān)于和聲明的變量和聲明的變量整體，會(huì)被提升到當(dāng)前作用域的頂部。做后臺(tái)服務(wù)端，處理請(qǐng)求的代碼，得自己實(shí)現(xiàn)了。為提高下載速度，可通過來切換鏡像源。 JS是解釋性語(yǔ)言,因node服務(wù)端的應(yīng)用，而貫通了前后臺(tái)。 【ES6】 關(guān)于var和let var: 1.var聲明的變量和function聲明的變量整體，會(huì)被提升到當(dāng)前作用域的頂部。 2...

    weizx 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<