Leistungstestvergleich von JS-Array-Deduplizierungsmethoden

Der Inhalt dieses Artikels befasst sich mit dem Leistungstestvergleich von JS-Array-Deduplizierungsmethoden. Ich hoffe, dass er für Sie hilfreich ist.

1. Testvorlage

Array-Deduplizierung ist ein häufiges Problem Internet. Verschiedene Lösungen

Um die Leistung dieser Lösungen zu testen, habe ich eine Testvorlage geschrieben, um den Zeitaufwand der Array-Deduplizierung zu berechnen

// distinct.js

let arr1 = Array.from(new Array(100000), (x, index)=>{
    return index
})

let arr2 = Array.from(new Array(50000), (x, index)=>{
    return index+index
})

let start = new Date().getTime()
console.log('开始数组去重')

function distinct(a, b) {
    // 数组去重
}

console.log('去重后的长度', distinct(arr1, arr2).length)

let end = new Date().getTime()
console.log('耗时', end - start)

Hier werden zwei Arrays mit Längen von 10 W bzw. 5 W erstellt

Führen Sie die beiden dann mit der Methode „distinct()“ zusammen Array und Duplikate entfernen

Die Datenmenge ist weder groß noch klein, kann aber bereits einige Probleme erklären

2 .Array.filter() + indexOf

Die Idee dieser Methode besteht darin, zwei Arrays zu einem Array zusammenzufassen und dann Array.filter() in ES6 zu verwenden Array durchqueren und mit indexOf kombinieren, um Duplikate auszuschließen

function distinct(a, b) {
    let arr = a.concat(b);    
    return arr.filter((item, index)=> {        
    return arr.indexOf(item) === index
    })
}

Dies ist die Array-Deduplizierungsmethode, über die ich mich beschwert habe, sie sieht sehr gut aus einfache, aber tatsächliche Leistung. . .

Ja, die Realität ist so grausam, es dauert 8427 ms, um ein Array mit einer Länge von 15 W zu verarbeiten

3. Doppelte for-Schleife

Am einfachsten zu verstehen ist, dass die äußere Schleife die Elemente durchläuft und die innere Schleife prüft ob es wiederholt wird

Wenn es doppelte Werte gibt, können Sie push() oder splice() verwenden

function distinct(a, b) {
    let arr = a.concat(b);
    for (let i=0, len=arr.length; i<len; i++) {
        for (let j=i+1; j<len; j++) {
            if (arr[i] == arr[j]) {
                arr.splice(j, 1);
                // splice 会改变数组长度，所以要将数组长度 len 和下标 j 减一
                len--;
                j--;
            }
        }
    }
    return arr
}

Aber diese Methode beansprucht mehr Speicher und ist am wenigsten effizient

4 . for...of + Includes()

Eine aktualisierte Version der doppelten for-Schleife wird durch die for...of-Anweisung ersetzt innere Schleife wird in Includes() geändert

Erstellen Sie zunächst ein leeres Array. Wenn Includes() „false“ zurückgibt, verschieben Sie das Element in das leere Array

Ähnlich können Sie auch indexOf() verwenden, um Includes() zu ersetzen

function distinct(a, b) {
    let arr = a.concat(b)
    let result = []
    for (let i of arr) {
        !result.includes(i) && result.push(i)
    }
    return result
}

Diese Methode ist filter + indexOf ziemlich ähnlich

Implementieren Sie einfach die interne Logik von filter() mithilfe einer for-Schleife und ersetzen Sie dann indexOf durch include

Die Dauer liegt also relativ nahe beieinander

5. Array.sort()

Verwenden Sie zuerst sort(), um das Array zu sortieren

und vergleichen Sie dann benachbarte Elemente auf Gleichheit, um so Duplikate auszuschließen

function distinct(a, b) {
    let arr = a.concat(b)
    arr = arr.sort()
    let result = [arr[0]]

    for (let i=1, len=arr.length; i<len; i++) {
        arr[i] !== arr[i-1] && result.push(arr[i])
    }
    return result
}

Diese Methode führt nur eine Sortierung und eine Schleife durch, daher ist die Effizienz höher als bei der oben genannten Methode

6. new Set()

ES6 fügt die Set-Datenstruktur hinzu, die einem Array ähnelt, aber Die Mitglieder von Set sind einzigartig

Basierend auf dieser Funktion eignet es sich sehr gut für die Array-Deduplizierung

function distinct(a, b) {
    return Array.from(new Set([...a, ...b]))
}

Wie lange dauert es, 15 W Daten mit Set zu verarbeiten?

Miau, miau? ? ? 57 ms? ? Bin ich nicht geblendet? ?

然后我在两个数组长度后面分别加了一个0，在 150W 的数据量之下...

居然有如此高性能且简洁的数组去重办法？！

七、for...of + Object

这个方法我只在一些文章里见过，实际工作中倒没怎么用

首先创建一个空对象，然后用 for 循环遍历

利用对象的属性不会重复这一特性，校验数组元素是否重复

function distinct(a, b) {
    let arr = a.concat(b)
    let result = []
    let obj = {}

    for (let i of arr) {
        if (!obj[i]) {
            result.push(i)
            obj[i] = 1
        }
    }

    return result
}

当我看到这个方法的处理时长，我又傻眼了

15W 的数据居然只要 16ms ？？？ 比 Set() 还快？？？

然后我又试了试 150W 的数据量...

Das obige ist der detaillierte Inhalt vonLeistungstestvergleich von JS-Array-Deduplizierungsmethoden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!