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

1. Verwendung von array.concat() y array.filter()
2. Neues Set-Objekt verwenden y Spread Operator

3. Verwendung von array.concat y neues Set-Objekt

   let array1 = [1, 2, 3, 4, 5] let array2 = [1, 4, 6, 9]

   // Using array.concat and array.filter const array3 = array1.concat(array2.filter((item)=> array1.indexOf(item) == -1 )) console.log('array3 : ', array3);

   // Using new Set and Spread Operator const array4 = [...new Set([...array1 ,...array2])]; console.log('array4 : ', array4);

   // Using array.concat and new Set const array5 = [...new Set(array1.concat(array2))]; console.log('array5 : ', array5);

Answer 2

Die einfachste Lösung mit Filter:

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

var mergedArrayWithoutDuplicates = array1.concat(
  array2.filter(seccondArrayItem => !array1.includes(seccondArrayItem))
);

Answer 3

Modular, Allgemein

Dies könnte durch die Zusammenstellung von zwei wesentlichen Funktionen erreicht werden.

const getUniqueMerge = (...arrs) => getUniqueArr(mergeArrs(...arrs))
const getUniqueArr = (array) => Array.from(new Set(array))  
const mergeArrs = (...arrs) => [].concat(...arrs)

Es kann unbegrenzt viele Arrays oder Werte verarbeiten

console.log(getUniqueMerge(["Vijendra","Singh"],["Singh", "Shakya"])
// ["Vijendra", "Singh", "Shakya"]

console.log(getUniqueMerge(["Sheldon", "Cooper"], ["and", "Cooper", "Amy", "and"], "Farrah", "Amy", "Fowler"))
// ["Sheldon", "Cooper", "and", "Amy", "Farrah", "Fowler"]

Answer 4

Wenn Sie Objektarrays zusammenführen, sollten Sie die Verwendung von lodash in Betracht ziehen UnionBy ermöglicht es Ihnen, benutzerdefinierte Prädikatsvergleichsobjekte festzulegen:

import { unionBy } from 'lodash';

const a = [{a: 1, b: 2}];
const b = [{a: 1, b: 3}];
const c = [{a: 2, b: 4}];

const result = UnionBy(a,b,c, x => x.a);

Das Ergebnis ist: [{ a: 1; b: 2 }, { a: 2; b: 4 }]

Der erste übergebene Treffer aus den Arrays wird im Ergebnis verwendet

Answer 5

Reduzieren Sie sie !!!

Bei dieser Alternative wird ein Array nicht explizit zusammengeführt und dedupliziert, sondern es wird ein Array genommen und mit einem anderen Array reduziert, so dass jeder Wert des ersten Arrays in einem akkumulativen Verhalten iteriert und destrukturiert werden kann, wobei die bereits enthaltenen Werte ignoriert werden, indem die Persistenz des Arrays aufgrund der Rekursivität ausgenutzt wird.

array2.reduce(reducer, array1.reduce(reducer, []))

Testbeispiel:

var array1 = ["Vijendra","Singh","Singh"];
var array2 = ["Singh", "Shakya", "Shakya"];
const reducer = (accumulator, currentValue) => accumulator.includes(currentValue) ? accumulator : [...accumulator, currentValue];

console.log(
  array2.reduce(reducer, array1.reduce(reducer, []))
);

// a reduce on first array is needed to ensure a deduplicated array used as initial value on the second array being reduced

Schlussfolgerung

Weitaus eleganter und nützlicher als langweilig for-each Ansatz vermieden werden soll (nicht, dass er nicht nützlich wäre).

Beschäftigt sich mit dem concat() Einschränkungen bei der Deduplizierung.

Sie benötigen weder externe Bibliotheken wie Underscore.js, JQuery oder Lo-Dash noch müssen Sie sich die Mühe machen, eine integrierte Funktion zu erstellen, um den gewünschten kombinierten und deduplizierten Effekt zu erzielen.

Oh, und HEY!, das kann man auch als Einzeiler machen!!!

---

Diese Antwort war möglich dank der ES5 (ECMAScript 2015), schön include() und prächtig reduce() .