0Pricing
JavaScript Academy · Aula

Rest e spread — arrays e objetos idiomáticos

Reúna o restante dos valores e propriedades, clone e mescle com spread e evite mutações ocultas usando padrões simples

Rest e spread — arrays e objetos idiomáticos é uma aula grátis de JavaScript Academy no CoddyKit. Esta é a aula 2 de 2. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de JavaScript Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de JavaScript Academy inclui 2 aulas no total.

Introdução

Objetivo: use rest para reunir extras e spread para copiar ou mesclar.

  • Expansão de matrizes e objetos
  • Argumentos restantes de matriz (início e fim)
  • Argumentos restantes de objeto (exclusão de algumas chaves)
  • Mutação versus cópia
Rest e spread — arrays e objetos idiomáticos — ilustração 1

Noções básicas da expansão de matrizes

[...arr] copia uma matriz; combine matrizes expandindo-as em uma nova matriz.

// Array spread creates a shallow copy and merges arrays
const a = [1, 2];
const b = [3, 4];

const clone = [...a];
const merged = [...a, ...b];

console.log("a:", a);
console.log("clone:", clone);
console.log("merged:", merged);
Rest e spread — arrays e objetos idiomáticos — ilustração 2

Padrão de argumentos restantes de matriz

O elemento restante (…tail) reúne o que sobrou em uma nova matriz.

// Array rest collects the remaining items
const nums = [10, 20, 30, 40];

const [head, ...tail] = nums;

console.log("head:", head);
console.log("tail:", tail);
Rest e spread — arrays e objetos idiomáticos — ilustração 3

Noções básicas da expansão de objetos

A mesclagem de objetos depende da ordem: expansões posteriores substituem as chaves anteriores.

// Object spread copies and merges; later keys win
const base = { theme: "light", compact: false };
const override = { compact: true };

const copy = { ...base };
const merged = { ...base, ...override };

console.log("copy:", copy);
console.log("merged:", merged);
Rest e spread — arrays e objetos idiomáticos — ilustração 4

Padrão de argumentos restantes de objeto

Use { a, ...rest } para extrair algumas propriedades e manter o restante reunido.

// Object rest collects remaining properties
const user = { id: 7, name: "Ayla", role: "admin" };

const { id, ...publicInfo } = user;

console.log("id:", id);
console.log("publicInfo:", publicInfo);
Rest e spread — arrays e objetos idiomáticos — ilustração 5

Evitando mutações por meio de cópias

Crie um novo objeto ao alterar valores; isso é mais claro e seguro do que alterar dados compartilhados.

// Copy instead of mutating original data
const settings = { sound: true, volume: 5 };

// Mutating version (avoid in shared state)
// settings.volume = 6;

// Non-mutating: create an updated copy
const updated = { ...settings, volume: 6 };

console.log("settings:", settings);
console.log("updated:", updated);
Rest e spread — arrays e objetos idiomáticos — ilustração 6

Quiz sobre argumentos restantes de objeto

Verificação rápida: argumentos restantes de objeto.

Rest e spread — arrays e objetos idiomáticos — ilustração 7

Recapitulação

Recapitulação: a expansão copia e mescla matrizes e objetos; os argumentos restantes reúnem o que sobrou. Prefira copiar em vez de fazer mutações para manter as alterações explícitas.

Rest e spread — arrays e objetos idiomáticos — ilustração 8

Perguntas Frequentes

A aula “Rest e spread — arrays e objetos idiomáticos” é grátis?

Sim — o texto completo de “Rest e spread — arrays e objetos idiomáticos” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de JavaScript Academy, atualize para CoddyKit PRO. O curso de JavaScript Academy inclui 2 aulas no total.

O que vou aprender em “Rest e spread — arrays e objetos idiomáticos”?

Reúna o restante dos valores e propriedades, clone e mescle com spread e evite mutações ocultas usando padrões simples Você pratica JavaScript Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar JavaScript Academy?

Nenhuma experiência prévia é necessária. JavaScript Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 2 de 2.

Quanto tempo leva a aula “Rest e spread — arrays e objetos idiomáticos”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de JavaScript Academy?

Sim. Cada aula de JavaScript Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

  1. Fundamentos da desestruturação de arrays e objetos
  2. Rest e spread — arrays e objetos idiomáticos
← Voltar para JavaScript Academy