En este post de programación con JS vamos a ver cómo mezclar dos objetos, de modo que combinemos sus propiedades y tengamos un nuevo objeto.

Veremos dos maneras de mezclar las propiedades de un objeto con JavaScript: con el operador spread y con una función manual.

Combinando objetos en JavaScript

Lo que tenemos que hacer es declarar un objeto vacío, ahí almacenaremos las propiedades de los objetos que vamos a combinar. Luego recorremos cada clave de los objetos y la vamos guardando (junto con su valor) en el nuevo objeto, así de simple.

Por cierto, en caso de que haya claves repetidas se van a mantener las propiedades del segundo objeto.

Con función manual

Si quieres hacerlo manualmente con una función puedes hacerlo como se ve a continuación:

const combinarObjetos = (objeto1, objeto2) => {
    const resultado = {};
    for (const clave of Object.keys(objeto1)) {
        resultado[clave] = objeto1[clave];
    }
    for (const clave of Object.keys(objeto2)) {
        resultado[clave] = objeto2[clave];
    }
    return resultado;
}

Con esto puedes mezclar cualquier cantidad de objetos en JavaScript, ya que puedes combinar el resultado con otro objeto.

Usando operador de propagación

Una manera más elegante es usar el spread operator u operador de propagación que se representa como ....

Éste operador es relativamente nuevo en JS y permite varias cosas como enviar los elementos de un arreglo como argumentos a una función o combinar objetos.

El operador “desempaca” los elementos. Entonces podemos combinar dos objetos así:

const combinadoConSpread = { ...objeto1, ...objeto2 };

Es más simple y elegante. Además, podemos combinar cualquier cantidad de objetos. Recuerda que la misma regla aplica: si existen claves repetidas, se mantendrán las del último objeto.

Poniendo todo junto

Ya te enseñé a colocar las propiedades de dos objetos en uno solo. Ahora te mostraré el código completo. Al final puedes usar el método que tú prefieras:

El código (que se puede ejecutar en Node y en el navegador) queda así:

// https://parzibyte.me/blog
const combinarObjetos = (objeto1, objeto2) => {
    const resultado = {};
    for (const clave of Object.keys(objeto1)) {
        resultado[clave] = objeto1[clave];
    }
    for (const clave of Object.keys(objeto2)) {
        resultado[clave] = objeto2[clave];
    }
    return resultado;
}
const objeto1 = {
    nombre: "Luis",
    mascotas: ["Maggie", "Panqué", "Grim"]
};

const objeto2 = {
    web: "https://parzibyte.me/blog",
    nombre: "Parzibyte",
};

const combinado = combinarObjetos(objeto1, objeto2);
const combinadoConSpread = { ...objeto1, ...objeto2 };
console.log("Combinado con función:");
console.log(combinado);
console.log("Combinado con spread operator:");
console.log(combinadoConSpread);

Por aquí te dejo más tutoriales de JavaScript.