Tengo dos matrices de JavaScript:

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

Quiero que la salida sea:

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

La matriz de salida debería tener palabras repetidas eliminadas.

¿Cómo fusiono dos matrices en JavaScript para obtener solo los elementos únicos de cada matriz en el mismo orden en que se insertaron en las matrices originales?

Para fusionar las matrices (sin eliminar duplicados)

Uso de la versión ES5 Array.concat:

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

console.log(array1.concat(array2));

Versión ES6 uso desestructuración

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

Dado que no hay una forma 'incorporada' de eliminar duplicados ( ECMA-262 realmente tiene lo Array.forEachque sería genial para esto), tenemos que hacerlo manualmente:

Array.prototype.unique = function() {
    var a = this.concat();
    for(var i=0; i<a.length; ++i) {
        for(var j=i+1; j<a.length; ++j) {
            if(a[i] === a[j])
                a.splice(j--, 1);
        }
    }

    return a;
};

Luego, para usarlo:

var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
// Merges both arrays and gets unique items
var array3 = array1.concat(array2).unique(); 

Esto también preservará el orden de las matrices (es decir, no es necesario ordenarlas).

Dado que muchas personas están molestas por el aumento de prototipos Array.prototypey los for inbucles, aquí hay una forma menos invasiva de usarlo:

function arrayUnique(array) {
    var a = array.concat();
    for(var i=0; i<a.length; ++i) {
        for(var j=i+1; j<a.length; ++j) {
            if(a[i] === a[j])
                a.splice(j--, 1);
        }
    }

    return a;
}

var array1 = ["Vijendra","Singh"];
var array2 = ["Singh", "Shakya"];
    // Merges both arrays and gets unique items
var array3 = arrayUnique(array1.concat(array2));

Para aquellos que tienen la suerte de trabajar con navegadores donde ES5 está disponible, pueden usar Object.definePropertyesto:

Object.defineProperty(Array.prototype, 'unique', {
    enumerable: false,
    configurable: false,
    writable: false,
    value: function() {
        var a = this.concat();
        for(var i=0; i<a.length; ++i) {
            for(var j=i+1; j<a.length; ++j) {
                if(a[i] === a[j])
                    a.splice(j--, 1);
            }
        }

        return a;
    }
});

Con Underscore.js o Lo-Dash puedes hacer:

console.log(_.union([1, 2, 3], [101, 2, 1, 10], [2, 1]));

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>

http://underscorejs.org/#union

http://lodash.com/docs#union

Primero concatene las dos matrices, luego filtre solo los elementos únicos:

var a = [1, 2, 3], b = [101, 2, 1, 10]
var c = a.concat(b)
var d = c.filter((item, pos) => c.indexOf(item) === pos)

console.log(d) // d is [1, 2, 3, 101, 10]

Editar

Como se sugirió, una solución más inteligente sería filtrar los elementos únicos bantes de concatenar con a:

var a = [1, 2, 3], b = [101, 2, 1, 10]
var c = a.concat(b.filter((item) => a.indexOf(item) < 0))

console.log(c) // c is [1, 2, 3, 101, 10]

Esta es una solución ECMAScript 6 que utiliza operadores de propagación y genéricos de matriz.

Actualmente solo funciona con Firefox, y posiblemente con Internet Explorer Technical Preview.

Pero si usas Babel , puedes tenerlo ahora.

const input = [
  [1, 2, 3],
  [101, 2, 1, 10],
  [2, 1]
];
const mergeDedupe = (arr) => {
  return [...new Set([].concat(...arr))];
}

console.log('output', mergeDedupe(input));

ES6

array1.push(...array2) // => don't remove duplication 

O

[...array1,...array2] //   =>  don't remove duplication 

O

[...new Set([...array1 ,...array2])]; //   => remove duplication

Usando un Set (ECMAScript 2015), será tan simple como eso:

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

Aquí hay una versión ligeramente diferente del ciclo. Con algunas de las optimizaciones en la última versión de Chrome, es el método más rápido para resolver la unión de las dos matrices (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);
  }
}

ciclo while: ~ 589k ops / s
filtro: ~ 445k ops / s
lodash: 308k ops / s
para bucles: 225k ops / s

Un comentario señaló que una de mis variables de configuración estaba causando que mi ciclo se adelantara al resto, porque no tenía que inicializar una matriz vacía para escribir. Estoy de acuerdo con eso, así que reescribí la prueba para igualar el campo de juego e incluí una opción aún más rápida.

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;
};

En esta solución alternativa, combiné la solución de matriz asociativa de una respuesta para eliminar la .indexOf()llamada en el ciclo que ralentizaba mucho las cosas con un segundo ciclo, e incluí algunas de las otras optimizaciones que otros usuarios también han sugerido en sus respuestas. .

La respuesta principal aquí con el doble bucle en cada valor (i-1) sigue siendo significativamente más lenta. a lodash todavía le está yendo bien, y todavía se lo recomendaría a cualquiera que no le importe agregar una biblioteca a su proyecto. Para aquellos que no quieren, mi ciclo while sigue siendo una buena respuesta y la respuesta del filtro tiene una muy buena presentación aquí, superando todas mis pruebas con el último Canary Chrome (44.0.2360) a partir de este escrito.

Echa un vistazo a la respuesta de Mike y la respuesta de Dan Stocker si quieres dar un paso a un nivel superior en la velocidad. Esos son, con mucho, el más rápido de todos los resultados después de analizar casi todas las respuestas viables.

Puede hacerlo simplemente con ECMAScript 6,

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

• Utilice el operador de propagación para concatenar la matriz.
• Use Set para crear un conjunto distinto de elementos.
• Nuevamente use el operador de propagación para convertir el conjunto en una matriz.

Array.prototype.merge = function(/* variable number of arrays */){
    for(var i = 0; i < arguments.length; i++){
        var array = arguments[i];
        for(var j = 0; j < array.length; j++){
            if(this.indexOf(array[j]) === -1) {
                this.push(array[j]);
            }
        }
    }
    return this;
};

Una función de combinación de matriz mucho mejor.

Solo tirando mis dos centavos.

function mergeStringArrays(a, b){
    var hash = {};
    var ret = [];

    for(var i=0; i < a.length; i++){
        var e = a[i];
        if (!hash[e]){
            hash[e] = true;
            ret.push(e);
        }
    }

    for(var i=0; i < b.length; i++){
        var e = b[i];
        if (!hash[e]){
            hash[e] = true;
            ret.push(e);
        }
    }

    return ret;
}

Este es un método que uso mucho, usa un objeto como una tabla hashlookup para hacer la verificación duplicada. Suponiendo que el hash es O (1), esto se ejecuta en O (n) donde n es a.length + b.length. Sinceramente, no tengo idea de cómo el navegador hace el hash, pero funciona bien en muchos miles de puntos de datos.

Simplemente manténgase alejado de los bucles anidados (O (n ^ 2)) y .indexOf()(+ O (n)).

function merge(a, b) {
    var hash = {}, i;
    for (i=0; i<a.length; i++) {
        hash[a[i]]=true;
    } 
    for (i=0; i<b.length; i++) {
        hash[b[i]]=true;
    } 
    return Object.keys(hash);
}

Simplificó lo mejor de esta respuesta y la convirtió en una buena función:

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

¿Por qué no usas un objeto? Parece que estás tratando de modelar un conjunto. Sin embargo, esto no preservará el orden.

var set1 = {"Vijendra":true, "Singh":true}
var set2 = {"Singh":true,  "Shakya":true}

// Merge second object into first
function merge(set1, set2){
  for (var key in set2){
    if (set2.hasOwnProperty(key))
      set1[key] = set2[key]
  }
  return set1
}

merge(set1, set2)

// Create set from array
function setify(array){
  var result = {}
  for (var item in array){
    if (array.hasOwnProperty(item))
      result[array[item]] = true
  }
  return result
}

La mejor solucion...

Puede verificar directamente en la consola del navegador presionando ...

Sin duplicado

a = [1, 2, 3];
b = [3, 2, 1, "prince"];

a.concat(b.filter(function(el) {
    return a.indexOf(el) === -1;
}));

Con duplicado

["prince", "asish", 5].concat(["ravi", 4])

Si lo desea sin duplicar, puede probar una mejor solución desde aquí: Código de gritos .

[1, 2, 3].concat([3, 2, 1, "prince"].filter(function(el) {
    return [1, 2, 3].indexOf(el) === -1;
}));

Probar en la consola del navegador Chrome

 f12 > console

Salida:

["prince", "asish", 5, "ravi", 4]

[1, 2, 3, "prince"]

Mi centavo y medio:

Array.prototype.concat_n_dedupe = function(other_array) {
  return this
    .concat(other_array) // add second
    .reduce(function(uniques, item) { // dedupe all
      if (uniques.indexOf(item) == -1) {
        uniques.push(item);
      }
      return uniques;
    }, []);
};

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

var result = array1.concat_n_dedupe(array2);

console.log(result);

Puede lograrlo simplemente usando Underscore.js's => uniq :

array3 = _.uniq(array1.concat(array2))

console.log(array3)

Imprimirá ["Vijendra", "Singh", "Shakya"] .

Para ES6, solo una línea:

a = [1, 2, 3, 4]
b = [4, 5]
[...new Set(a.concat(b))]  // [1, 2, 3, 4, 5]

Sé que esta pregunta no se trata de una variedad de objetos, pero los buscadores terminan aquí.

Por lo tanto, vale la pena agregar para futuros lectores una forma adecuada de combinar ES6 y luego eliminar duplicados

conjunto de objetos :

var arr1 = [ {a: 1}, {a: 2}, {a: 3} ];
var arr2 = [ {a: 1}, {a: 2}, {a: 4} ];

var arr3 = arr1.concat(arr2.filter( ({a}) => !arr1.find(f => f.a == a) ));

// [ {a: 1}, {a: 2}, {a: 3}, {a: 4} ]

//Array.indexOf was introduced in javascript 1.6 (ECMA-262) 
//We need to implement it explicitly for other browsers, 
if (!Array.prototype.indexOf)
{
  Array.prototype.indexOf = function(elt, from)
  {
    var len = this.length >>> 0;

    for (; from < len; from++)
    {
      if (from in this &&
          this[from] === elt)
        return from;
    }
    return -1;
  };
}
//now, on to the problem

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

var merged = array1.concat(array2);
var t;
for(i = 0; i < merged.length; i++)
  if((t = merged.indexOf(i + 1, merged[i])) != -1)
  {
    merged.splice(t, 1);
    i--;//in case of multiple occurrences
  }

La implementación del indexOfmétodo para otros navegadores se toma de MDC

Nueva solución (que usa Array.prototype.indexOfy Array.prototype.concat):

Array.prototype.uniqueMerge = function( a ) {
    for ( var nonDuplicates = [], i = 0, l = a.length; i<l; ++i ) {
        if ( this.indexOf( a[i] ) === -1 ) {
            nonDuplicates.push( a[i] );
        }
    }
    return this.concat( nonDuplicates )
};

Uso:

>>> ['Vijendra', 'Singh'].uniqueMerge(['Singh', 'Shakya'])
["Vijendra", "Singh", "Shakya"]

Array.prototype.indexOf (para Internet Explorer):

Array.prototype.indexOf = Array.prototype.indexOf || function(elt)
  {
    var len = this.length >>> 0;

    var from = Number(arguments[1]) || 0;
    from = (from < 0) ? Math.ceil(from): Math.floor(from); 
    if (from < 0)from += len;

    for (; from < len; from++)
    {
      if (from in this && this[from] === elt)return from;
    }
    return -1;
  };

Se puede hacer usando Set.

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

var array3 = array1.concat(array2);
var tempSet = new Set(array3);
array3 = Array.from(tempSet);

//show output
document.body.querySelector("div").innerHTML = JSON.stringify(array3);

<div style="width:100%;height:4rem;line-height:4rem;background-color:steelblue;color:#DDD;text-align:center;font-family:Calibri" > 
  temp text 
</div>

Hay tantas soluciones para fusionar dos matrices. Se pueden dividir en dos categorías principales (excepto el uso de bibliotecas de terceros como lodash o underscore.js).

a) combine dos matrices y elimine los elementos duplicados.

b) filtrar elementos antes de combinarlos.

Combina dos matrices y elimina elementos duplicados

Combinatorio

// mutable operation(array1 is the combined array)
array1.push(...array2);
array1.unshift(...array2);

// immutable operation
const combined = array1.concat(array2);
const combined = [...array1, ...array2];    // ES6

Unificador

Hay muchas formas de unificar una matriz, personalmente sugiero a continuación dos métodos.

// a little bit tricky
const merged = combined.filter((item, index) => combined.indexOf(item) === index);
const merged = [...new Set(combined)];

Filtrar elementos antes de combinarlos

También hay muchas formas, pero personalmente sugiero el siguiente código debido a su simplicidad.

const merged = array1.concat(array2.filter(secItem => !array1.includes(secItem)));

Array.prototype.add = function(b){
    var a = this.concat();                // clone current object
    if(!b.push || !b.length) return a;    // if b is not an array, or empty, then return a unchanged
    if(!a.length) return b.concat();      // if original is empty, return b

    // go through all the elements of b
    for(var i = 0; i < b.length; i++){
        // if b's value is not in a, then add it
        if(a.indexOf(b[i]) == -1) a.push(b[i]);
    }
    return a;
}

// Example:
console.log([1,2,3].add([3, 4, 5])); // will output [1, 2, 3, 4, 5]

array1.concat(array2).filter((value, pos, arr)=>arr.indexOf(value)===pos)

Lo bueno de este es el rendimiento y que, en general, cuando trabajas con matrices, estás encadenando métodos como filtro, mapa, etc. para que puedas agregar esa línea y concat y deduplicará array2 con array1 sin necesidad de una referencia a lo posterior uno (cuando está encadenando métodos que no tiene), ejemplo:

someSource()
.reduce(...)
.filter(...)
.map(...) 
// and now you want to concat array2 and deduplicate:
.concat(array2).filter((value, pos, arr)=>arr.indexOf(value)===pos)
// and keep chaining stuff
.map(...)
.find(...)
// etc

(No me gusta contaminar Array.prototype y esa sería la única forma de respetar la cadena: definir una nueva función la romperá, así que creo que algo como esto es la única forma de lograrlo)

Puedes probar esto:

const union = (a, b) => Array.from(new Set([...a, ...b]));

console.log(union(["neymar","messi"], ["ronaldo","neymar"]));

Un enfoque funcional con ES2015

Seguir el enfoque funcional a unionde dos Arrays es solo la composición de concaty filter. Para proporcionar un rendimiento óptimo, recurrimos al Settipo de datos nativo , que está optimizado para búsquedas de propiedades.

De todos modos, la pregunta clave junto con una unionfunción es cómo tratar los duplicados. Son posibles las siguientes permutaciones:

Array A      + Array B

[unique]     + [unique]
[duplicated] + [unique]
[unique]     + [duplicated]
[duplicated] + [duplicated]

Las dos primeras permutaciones son fáciles de manejar con una sola función. Sin embargo, los dos últimos son más complicados, ya que no puede procesarlos mientras confíe en las Setbúsquedas. Dado que cambiar a Objectbúsquedas de propiedades antiguas simples implicaría un golpe de rendimiento serio, la siguiente implementación simplemente ignora la tercera y cuarta permutación. Tendría que construir una versión separada de unionpara apoyarlos.

// small, reusable auxiliary functions

const comp = f => g => x => f(g(x));
const apply = f => a => f(a);
const flip = f => b => a => f(a) (b);
const concat = xs => y => xs.concat(y);
const afrom = apply(Array.from);
const createSet = xs => new Set(xs);
const filter = f => xs => xs.filter(apply(f));


// de-duplication

const dedupe = comp(afrom) (createSet);


// the actual union function

const union = xs => ys => {
  const zs = createSet(xs);  
  return concat(xs) (
    filter(x => zs.has(x)
     ? false
     : zs.add(x)
  ) (ys));
}


// mock data

const xs = [1,2,2,3,4,5];
const ys = [0,1,2,3,3,4,5,6,6];


// here we go

console.log( "unique/unique", union(dedupe(xs)) (ys) );
console.log( "duplicated/unique", union(xs) (ys) );

De aquí en adelante, resulta trivial implementar una unionnfunción que acepte cualquier número de matrices (inspiradas en los comentarios de naomik):

// small, reusable auxiliary functions

const uncurry = f => (a, b) => f(a) (b);
const foldl = f => acc => xs => xs.reduce(uncurry(f), acc);

const apply = f => a => f(a);
const flip = f => b => a => f(a) (b);
const concat = xs => y => xs.concat(y);
const createSet = xs => new Set(xs);
const filter = f => xs => xs.filter(apply(f));


// union and unionn

const union = xs => ys => {
  const zs = createSet(xs);  
  return concat(xs) (
    filter(x => zs.has(x)
     ? false
     : zs.add(x)
  ) (ys));
}

const unionn = (head, ...tail) => foldl(union) (head) (tail);


// mock data

const xs = [1,2,2,3,4,5];
const ys = [0,1,2,3,3,4,5,6,6];
const zs = [0,1,2,3,4,5,6,7,8,9];


// here we go

console.log( unionn(xs, ys, zs) );

Resulta que unionnes solo foldl(aka Array.prototype.reduce), que toma unioncomo su reductor. Nota: Dado que la implementación no utiliza un acumulador adicional, arrojará un error cuando lo aplique sin argumentos.

por el bien de esto ... aquí hay una solución de línea única:

const x = [...new Set([['C', 'B'],['B', 'A']].reduce( (a, e) => a.concat(e), []))].sort()
// ['A', 'B', 'C']

No es particularmente legible, pero puede ayudar a alguien:

1. Aplica una función de reducción con el valor inicial del acumulador establecido en una matriz vacía.
2. La función reduce utiliza concat para agregar cada subconjunto al conjunto acumulador.
3. El resultado de esto se pasa como un parámetro constructor para crear un nuevo Set .
4. El operador de propagación se utiliza para convertir el Seta una matriz.
5. La sort()función se aplica a la nueva matriz.

DeDuplicate single o Merge y DeDuplicate múltiples entradas de matriz. Ejemplo a continuación.

utilizando ES6 - Conjunto, para, de desestructuración

Escribí esta función simple que toma múltiples argumentos de matriz. Hace más o menos lo mismo que la solución anterior, solo tiene un caso de uso más práctico. Esta función no concatena valores duplicados en una sola matriz para que pueda eliminarlos en una etapa posterior.

DEFINICIÓN DE FUNCIÓN CORTA (solo 9 líneas)

/**
* This function merging only arrays unique values. It does not merges arrays in to array with duplicate values at any stage.
*
* @params ...args Function accept multiple array input (merges them to single array with no duplicates)
* it also can be used to filter duplicates in single array
*/
function arrayDeDuplicate(...args){
   let set = new Set(); // init Set object (available as of ES6)
   for(let arr of args){ // for of loops through values
      arr.map((value) => { // map adds each value to Set object
         set.add(value); // set.add method adds only unique values
      });
   }
   return [...set]; // destructuring set object back to array object
   // alternativly we culd use:  return Array.from(set);
}

EJEMPLO DE USO CODEPEN :

// SCENARIO 
let a = [1,2,3,4,5,6];
let b = [4,5,6,7,8,9,10,10,10];
let c = [43,23,1,2,3];
let d = ['a','b','c','d'];
let e = ['b','c','d','e'];

// USEAGE
let uniqueArrayAll = arrayDeDuplicate(a, b, c, d, e);
let uniqueArraySingle = arrayDeDuplicate(b);

// OUTPUT
console.log(uniqueArrayAll); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 43, 23, "a", "b", "c", "d", "e"]
console.log(uniqueArraySingle); // [4, 5, 6, 7, 8, 9, 10]

var arr1 = [1, 3, 5, 6];
var arr2 = [3, 6, 10, 11, 12];
arr1.concat(arr2.filter(ele => !arr1.includes(ele)));
console.log(arr1);

output :- [1, 3, 5, 6, 10, 11, 12]