O Spread-Operator é uma ferramenta versátil em JavaScript que permite lidar com objetos e arrays de forma eficiente. Você vai aprender como mesclar objetos com o Spread-Operator e quais alternativas estão disponíveis. Vamos mergulhar diretamente!
Principais conclusões
- O Spread-Operator pode ser usado para combinar vários objetos em um novo objeto.
- Object.assign() é um método flexível que fornece resultados semelhantes ao Spread-Operator, mas pode permitir outros casos de uso.
- Em ambos os métodos, apenas o primeiro nível dos objetos é copiado; objetos mais profundos permanecem referenciados.
Guia passo a passo para o Spread-Operator em objetos
Vamos começar com uma compreensão básica do Spread-Operator em JavaScript, especificamente para objetos.
Passo 1: Criar objetos
Para trabalhar com o Spread-Operator, você deve primeiro definir alguns objetos. Suponha que você tenha dois objetos, obj1 e obj2.

Passo 2: Aplicação do Spread-Operator
Agora você quer mesclar ambos os objetos em um novo objeto chamado result. Para isso, coloque o Spread-Operator (...) antes dos objetos.
Aqui, result conterá todas as propriedades de obj1 e obj2.

Passo 3: Verificar resultados
Para verificar se os objetos foram mesclados corretamente, você pode usar o console.

Passo 4: Adicionar propriedades
Além disso, você pode adicionar mais propriedades ao novo objeto.
Passo 5: Ordem das propriedades
A ordem das propriedades no objeto resultante baseia-se na sequência em que você especifica os objetos e propriedades no código. Aqui, a propriedade f aparecerá após obj1 e obj2.
Passo 6: Uso de Object.assign()
Uma alternativa ao Spread-Operator é o método Object.assign(). Ele funciona de forma semelhante, mas usa uma sintaxe diferente. Aqui, você cria um objeto vazio como objeto de destino e, em seguida, adiciona as propriedades de obj1 e obj2.
Passo 7: Verificação da saída
Assim como antes, você pode verificar a saída do Object.assign().
Passo 8: Combinar vários objetos
Você também pode combinar mais de dois objetos simplesmente passando-os como parâmetros adicionais para o Object.assign().
Passo 9: Omitindo o objeto vazio
Se você omitir o objeto de destino vazio, obj1 será sobrescrito e as propriedades de obj2 serão transferidas para obj1. Note que isso modifica o obj1 original.
Passo 10: Conclusão sobre Deep Copy
É importante saber que tanto o Spread-Operator quanto o Object.assign() não criam cópias profundas de objetos. Eles apenas copiam o primeiro nível das propriedades. Para estruturas de dados mais complexas, você pode precisar usar outros métodos.
Resumo – O Spread-Operator para objetos: Um guia completo
Neste guia, você recebeu uma introdução abrangente ao Spread-Operator e ao método Object.assign(). Você aprendeu como mesclar objetos e adicionar novas propriedades, além das vantagens e desvantagens dos dois métodos.
Perguntas frequentes
Como funciona o Spread-Operator em objetos?O Spread-Operator copia as propriedades de um objeto para um novo objeto.
Posso combinar vários objetos com Object.assign()?Sim, você pode combinar quantos objetos quiser com Object.assign(), passando-os como parâmetros.
O que acontece se eu passar um objeto vazio para o Object.assign() como destino?O objeto vazio será preenchido com as propriedades dos objetos subsequentes, sem alterar o objeto de destino original.
É criada uma cópia profunda de objetos?Não, tanto o Spread-Operator quanto o Object.assign() criam apenas cópias rasas dos objetos.
A ordem das propriedades no objeto resultante pode ser influenciada?Sim, a ordem das propriedades corresponde à sequência em que você especifica os objetos.