Cópia Rasa e Profunda
Parte da seção Lógica & Fluxo do Journey de JavaScript da Coddy. Lição 25 de 65.
Ao copiar objetos, temos dois tipos de cópia:
- Cópia superficial - copia apenas o primeiro nível
- Cópia profunda - copia todos os níveis aninhados
Métodos de cópia superficial:
Usando o operador spread:
const original = { a: 1, b: { x: 2 } };
const spreadCopy = { ...original };Usando Object.assign(), que cria um novo objeto copiando propriedades do objeto de origem para o objeto de destino:
const assignCopy = Object.assign({}, original);Problema com cópia superficial:
original.b.x = 3;
console.log(spreadCopy.b.x); // 3
// (objetos aninhados compartilham referência)
console.log(assignCopy.b.x); // 3Entendendo os métodos JSON e a cópia profunda
JSON.stringify() converte um objeto JavaScript em uma string JSON:
const obj = { name: "John", age: 30 };
const jsonString = JSON.stringify(obj);
console.log(jsonString); // "{"name":"John","age":30}"JSON.parse() converte uma string JSON novamente em um objeto JavaScript:
const backToObject = JSON.parse(jsonString);
console.log(backToObject); // { name: "John", age: 30 }Cópia profunda usando JSON:
const original = { a: 1, b: { x: 2 } };
const deepCopy = JSON.parse(JSON.stringify(original));
original.b.x = 3;
console.log(deepCopy.b.x); // 2 (completamente independente)
Desafio
FácilCrie uma função chamada processCart que recebe uma string JSON representando um carrinho de compras. O carrinho contém uma matriz de produtos com nomes e preços. Sua tarefa é:
- Analisar a string JSON em um objeto JavaScript
- Criar DOIS carrinhos separados a partir dela
- No segundo carrinho:
- Adicionar uma propriedade
discounteda cada item, definida como false - Aplicar um desconto de 10% a todos os itens que tenham
pricemaior que 50 - Definir 'discounted' como true para os itens que receberam o desconto
- Adicionar uma propriedade
- Retornar uma matriz contendo os dois carrinhos
Experimente você mesmo
function processCart(jsonString) {
// Escreva o código aqui
}
// Não escreva nada fora da função
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 JSONPratique por conta própria: Compilador de JavaScript online