Zusammenführen von zwei Arrays in JavaScript und Duplizieren von Elementen

Question

Ich habe zwei JavaScript-Arrays:

var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];

Ich möchte, dass die Ausgabe so aussieht:

var array3 = ["Vijendra","Singh","Shakya"];

Im Ausgabe-Array sollten wiederholte Wörter entfernt werden.

Wie kann ich zwei Arrays in JavaScript zusammenführen, so dass ich nur die eindeutigen Elemente aus jedem Array in der gleichen Reihenfolge erhalte, in der sie in die ursprünglichen Arrays eingefügt wurden?

Answer 1

Mit einer Satz (ECMAScript 2015) wird es so einfach sein wie das:

const array1 = ["Vijendra", "Singh"];
const array2 = ["Singh", "Shakya"];
console.log(Array.from(new Set(array1.concat(array2))));

Answer 2

Mit ECMAScript 6 können Sie das ganz einfach tun,

var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = [...new Set([...array1 ,...array2])];
console.log(array3); // ["Vijendra", "Singh", "Shakya"];

• Verwenden Sie die Spread-Operator für die Verkettung des Arrays.
• Utilisez Satz für die Erstellung einer bestimmten Gruppe von Elementen.
• Verwenden Sie wiederum den Spread-Operator, um die Menge in ein Array umzuwandeln.

Answer 3

Hier ist eine etwas andere Sichtweise auf die Schleife. Mit einigen der Optimierungen in der neuesten Version von Chrome ist dies die schnellste Methode, um die Vereinigung der beiden Arrays aufzulösen (Chrome 38.0.2111).

http://jsperf.com/merge-two-arrays-keeping-only-unique-values

var array1 = ["Vijendra", "Singh"];
var array2 = ["Singh", "Shakya"];
var array3 = [];

var arr = array1.concat(array2),
  len = arr.length;

while (len--) {
  var itm = arr[len];
  if (array3.indexOf(itm) === -1) {
    array3.unshift(itm);
  }
}

while-Schleife: ~589k ops/s
filtern: ~445k ops/s
lodash: 308k ops/s
for-Schleifen: 225k ops/s

Ein Kommentar wies darauf hin, dass eine meiner Setup-Variablen dazu führte, dass meine Schleife dem Rest vorauseilte, weil sie kein leeres Array initialisieren musste, in das sie schreiben konnte. Dem stimme ich zu. Deshalb habe ich den Test umgeschrieben, um das Spielfeld auszugleichen, und eine noch schnellere Option eingebaut.

http://jsperf.com/merge-two-arrays-keeping-only-unique-values/52

let whileLoopAlt = function (array1, array2) {
    const array3 = array1.slice(0);
    let len1 = array1.length;
    let len2 = array2.length;
    const assoc = {};

    while (len1--) {
        assoc[array1[len1]] = null;
    }

    while (len2--) {
        let itm = array2[len2];

        if (assoc[itm] === undefined) { // Eliminate the indexOf call
            array3.push(itm);
            assoc[itm] = null;
        }
    }

    return array3;
};

In dieser alternativen Lösung habe ich die assoziative Array-Lösung der einen Antwort kombiniert, um die .indexOf() Aufruf in der Schleife, der die Dinge mit einer zweiten Schleife stark verlangsamte, und berücksichtigte einige der anderen Optimierungen, die andere Benutzer in ihren Antworten vorgeschlagen haben.

Die oberste Antwort hier mit der Doppelschleife auf jedem Wert (i-1) ist immer noch deutlich langsamer. lodash ist immer noch stark, und ich würde es immer noch jedem empfehlen, dem es nichts ausmacht, eine Bibliothek zu seinem Projekt hinzuzufügen. Für diejenigen, die das nicht wollen, ist meine while-Schleife immer noch eine gute Antwort, und die Filter-Antwort hat hier eine sehr starke Leistung, die alle meine Tests mit dem neuesten Canary Chrome (44.0.2360) zum Zeitpunkt dieses Schreibens übertrifft.

Überprüfen Sie Mikes Antwort y Dan Stocker's Antwort wenn Sie einen Gang zulegen wollen. Das sind bei weitem die schnellsten Ergebnisse, nachdem ich fast alle in Frage kommenden Antworten durchgegangen bin.

Answer 4

Ich vereinfachte das Beste aus diese Antwort und machte daraus eine schöne Funktion:

function mergeUnique(arr1, arr2){
    return arr1.concat(arr2.filter(function (item) {
        return arr1.indexOf(item) === -1;
    }));
}

Answer 5

ES6 bietet eine einzeilige Lösung für das Zusammenführen mehrerer Arrays ohne Duplikate durch die Verwendung von destructuring und set.

const array1 = ['a','b','c'];
const array2 = ['c','c','d','e'];
const array3 = [...new Set([...array1,...array2])];
console.log(array3); // ["a", "b", "c", "d", "e"]