Desestruturação e Spread: Magia Moderna 🪄

O que vais aprender nesta aula:

  • Destructuring: Extrair dados de objetos/arrays rapidamente.
  • Spread Operator (`...`): Espalhar e copiar dados.
  • Rest Operator (`...`): Agrupar o resto dos dados.

🧠 Teoria (com Analogia)

🎒 A Mala de Ferramentas

Imagina que tens uma mala com ferramentas: `{ martelo, chave, serrote }`.

Destructuring: É meteres a mão na mala e tirares apenas o martelo para o teu bolso, sem teres de levar a mala toda atrás.

const { martelo } = mala;

Spread: É virares a mala ao contrário e despejares todas as ferramentas noutra mala maior.

const malaGrande = [ ...malaPequena, berbequim ];

💻 Prática Interativa

Origem (Base de Dados)

const utilizador = {
  nome: "Ana",
  idade: 28,
  skills: ["JS", "CSS", "HTML"],
  nivel: "Senior"
};

Extracção (Destructuring)

Clica nos botões para extrair...

✅ Verificação de Conhecimento

1. O que faz o código `const { a } = obj`?

Cria um novo objeto `a` vazio.
Cria uma variável `a` com o valor da propriedade `obj.a`.
Apaga a propriedade `a` de `obj`.

2. Para que servem os `...` (Três pontos)?

Spread (Espalhar) ou Rest (Agrupar), dependendo do contexto.
É apenas para comentários.
Pausa a execução do código (como o await).