Mesclando Objetos JavaScript com Reduce e Concat

Beginner

This tutorial is from open-source community. Access the source code

Introdução

Neste laboratório, exploraremos o processo de mesclar objetos em JavaScript. O laboratório irá guiá-lo pelos passos de criação de um novo objeto combinando dois ou mais objetos. Você aprenderá como usar Array.prototype.reduce() e Object.keys() para iterar sobre objetos e chaves, e Object.prototype.hasOwnProperty() e Array.prototype.concat() para mesclar valores para chaves existentes.

Este é um Lab Guiado, que fornece instruções passo a passo para ajudá-lo a aprender e praticar. Siga as instruções cuidadosamente para completar cada etapa e ganhar experiência prática. Dados históricos mostram que este é um laboratório de nível iniciante com uma taxa de conclusão de 100%. Recebeu uma taxa de avaliações positivas de 100% dos estudantes.

Função de Mesclagem de Objetos

Para mesclar dois ou mais objetos, siga os passos fornecidos:

  1. Abra o Terminal/SSH e digite node para começar a codificar.
  2. Use Array.prototype.reduce() juntamente com Object.keys() para iterar sobre todos os objetos e chaves.
  3. Use Object.prototype.hasOwnProperty() e Array.prototype.concat() para anexar valores para chaves existentes em múltiplos objetos.
  4. Use o trecho de código fornecido para criar um novo objeto a partir da combinação de dois ou mais objetos.
const merge = (...objs) =>
  [...objs].reduce(
    (acc, obj) =>
      Object.keys(obj).reduce((a, k) => {
        acc[k] = acc.hasOwnProperty(k)
          ? [].concat(acc[k]).concat(obj[k])
          : obj[k];
        return acc;
      }, {}),
    {}
  );

Por exemplo, considere os seguintes objetos:

const object = {
  a: [{ x: 2 }, { y: 4 }],
  b: 1
};
const other = {
  a: { z: 3 },
  b: [2, 3],
  c: "foo"
};

Quando você mescla esses dois objetos usando a função merge(), você obtém o seguinte resultado:

merge(object, other);
// { a: [ { x: 2 }, { y: 4 }, { z: 3 } ], b: [ 1, 2, 3 ], c: 'foo' }

Resumo

Parabéns! Você concluiu o laboratório de Mesclagem de Objetos. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.