O Spread Operator Parte 1
Parte da seção Lógica & Fluxo do Journey de JavaScript da Coddy — lição 18 de 65.
O operador spread (...) tem muitos casos de uso para JSON. Por exemplo, ao realizar a seguinte operação:
const obj1 = {key1: "123"}
const obj2 = obj1
obj1.key1 = "456
console.log(obj2.key1)Qual seria a saída?
console.log(obj2.key1)
// Saída: "456"Isso pode ser surpreendente! Embora tenhamos alterado apenas obj1, obj2 também mudou.
Isso acontece porque quando atribuímos objetos diretamente (obj2 = obj1), estamos criando uma referência, não uma cópia. Ambas as variáveis apontam para o mesmo objeto na memória.
É aqui que o operador spread se torna útil. Vamos ver como criar uma cópia real:
const obj1 = {key1: "123"};
const obj2 = {...obj1};
obj1.key1 = "456";
console.log(obj2.key1);
// Saída: "123"O operador spread cria um novo objeto e copia todas as propriedades enumeráveis do objeto de origem para o novo.
Teste seus conhecimentosEsta lição inclui um quiz rápido. Comece a lição para respondê-lo e acompanhar seu progresso.
Teste seus conhecimentosEsta lição inclui um quiz rápido. Comece a lição para respondê-lo e acompanhar seu progresso.
Folha de consulta
O operador spread (...) cria uma cópia de um objeto em vez de uma referência:
// Referência (ambas as variáveis apontam para o mesmo objeto)
const obj1 = {key1: "123"}
const obj2 = obj1
obj1.key1 = "456"
console.log(obj2.key1) // Saída: "456"// Cópia usando o operador spread
const obj1 = {key1: "123"}
const obj2 = {...obj1}
obj1.key1 = "456"
console.log(obj2.key1) // Saída: "123"O operador spread copia todas as propriedades enumeráveis do objeto de origem para um novo objeto.
Experimente você mesmo
Esta lição não inclui um desafio de código.
Teste seus conhecimentosEsta lição inclui um quiz rápido. Comece a lição para respondê-lo e acompanhar seu progresso.
Todas as lições de Lógica & Fluxo
1Strings em Profundidade
Fundamentos de StringsIterar sobre StringsTemplate LiteralsMétodos de StringRecapitulação - String Weaver4JSON Parte 2
Iterar sobre JSONJSON AninhadoEncadeamento Opcional em JSONCópia Rasa e ProfundaRecapitulação - Loja de BicicletasRecapitulação - Sistema Solar7Sistema de Gerenciamento de Biblioteca
Visão Geral do ProjetoAdicionando Livros
Buscar por TítuloFiltrar por GêneroMarcar como Lido10Gerenciar Sistema de Festival
Visão Geral do ProjetoAdicionar Filmes e LocaisAdicionar SessãoComprar IngressosAvaliar FilmesCancelar Sessões2Arrays Multidimensionais
Fundamentos de Arrays 2DAcessando Elementos de Arrays 2DLoops Aninhados com Arrays 2DRecapitulação - Arrays 2DAdição e Subtração de MatrizesArrays IrregularesArrays 3D e AlémPadrões Comuns de Arrays 2DRecapitulação - Tudo Sobre Arrays5Sets Parte 1
O que é um Set?Iterando sobre SetsAdicionando um elementoRemovendo um elementoVerificando se um elemento existeTamanho e Is EmptyCopy e ClearRecapitulação - O básico de Sets8Tópicos Interessantes sobre Arrays
Desestruturação de ArraysSintaxe Spread em ArraysArrays EsparsosRecapitulação - Workshop de Arrays3JSON Parte 1
O que é um JSON?Verificar se a Chave ExisteMétodos de ObjetoO Spread Operator Parte 1O Spread Operator Parte 2Remover ChavesRecapitulação - Manipular Chaves JSON