> Faqs > ¿Cuál es la mejor manera de hacer un merge sobre dos objetos en Javascript?

¿Cuál es la mejor manera de hacer un merge sobre dos objetos en Javascript?

Tengo dos objetos de Javascript.

const obj1 = {
    name: "pepe",
    age: 6,
    course: '1º primaria'
}

const obj2 = {
    course: '2º primaria',
    address: 'Av. JS, 2'
}

Deseo hacer un merge entre estos dos objetos. La operación debe devolverme un tercer objeto que es la suma de el obj1 y el obj2.

  • Tendrá todas las propiedades del objeto 1
  • Sumará todas las propiedades del objeto 2
  • Si las propiedades del objeto 2 existen en el objeto 1, entonces se sustituyen (se quedan las del objeto 2)

Según tengo entendido no existe una función de merge en Javascript, que lo haga de manera nativa. ¿Cuál sería la mejor manera de mezclar las propiedades de ambos objetos?

Respuestas

Efectivamente, no existe una manera de hacer merge a dos objetos Javascript, pero se puede conseguir muy fácilmente por medio del operador de propagación (spread).

Para tus dos objetos, sería tan sencillo como hacer lo siguiente:

const obj3 = {
  ...obj1,
  ...obj2
}

Como dices, se mezclarán las propiedades, siendo las propiedades de obj2 que sobreescribirán las de obj1.

Sergio
321 9 28 12
Gracias por la respuesta! veo que así es muy fácil, pero que existen otros métodos si no puedes usar versiones más nuevas de js. Me gustaría marcar como válidas también otras respuestas. Saludos existen varias formas de lograrlo, aunque las posibilidades son muchas más Quisiera darte mas ayuda, pero este portal es pésimo y no permite comentarios largos y así no se te puede ayudar mucho. Dame tu email y con gusto te apoyo.

La respuesta que apunta Sergio, con el operador spread en objetos, es muy buena y quizás sea la mejor. Sin embargo ese operador a nivel de objeto está disponible solo a partir de EcmaScript 2018, si no me equivoco, por lo que no todos los navegadores la podrían hacer.

Por eso es posible conseguir un resultado similar por medio de un algoritmo, que crea un objeto 3 y va recorriendo las propiedades del objeto 1 y el objeto 2 para hacer un merge, pero manual.

El código sería:

const obj1 = {
  name: "pepe",
  age: 6,
  course: '1º primaria'
}

const obj2 = {
  course: '2º primaria',
  address: 'Av. JS, 2'
}

let obj3 = {}
for (let i in obj1) {
  obj3[i] = obj1[i];
}
for(let i in obj2) {
  obj3[i] = obj2[i];
}

Esto funcionaría en todos los navegadores, incluso viejos Internet Explorer que andan por ahí.

Agustín
180 4 13 9
Muchas gracias Joaquín, este script se ve muy comprensible, seguro que funciona en todos los navegadores.

Hay una tercera manera de hacer el merge entre dos objetos Javascript, que funcionaría en todos los navegadores actuales.

let objeto_resultado_merge = Object.assign(obj1, obj2);

No considero navegador actual a IExplorer. La verdad no sé si esto funciona en ese navegador. Pero en todos los otros navegadores del mercado diría que funciona sin problemas.

Miguel Angel
2725 126 182 12
Gracias por la respuesta!