0Pricing
JavaScript Academy · Lezione

Basi del destructuring di array e oggetti

Destructuring di array e oggetti: basi, elementi saltati, valori predefiniti, ridenominazione e un semplice trucco per lo scambio.

Basi del destructuring di array e oggetti è una lezione JavaScript Academy gratuita su CoddyKit. Questa è la lezione 1 di 2. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento JavaScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso JavaScript Academy include 2 lezioni in totale.

Introduzione

Obiettivo: estrarre in modo ordinato i valori da array e oggetti.

  • Destructuring degli array
  • Ignorare elementi e usare valori predefiniti
  • Destructuring degli oggetti
  • Rinominare e scambiare valori
Basi del destructuring di array e oggetti — illustrazione 1

Nozioni di base sugli array

I pattern degli array corrispondono alle posizioni. Il primo elemento viene assegnato alla prima variabile, e così via.

// Array destructuring: assign by position
const pair = [10, 20];

const [x, y] = pair;

console.log("x:", x);
console.log("y:", y);
Basi del destructuring di array e oggetti — illustrazione 2

Ignorare elementi e usare valori predefiniti

Utilizzi le virgole per ignorare le posizioni. Aggiunga = default per gli elementi undefined o mancanti.

// Skip items with commas and provide defaults
const triple = [5, undefined, 9];

// Skip the middle, provide default for missing/undefined
const [first, , third = 0] = triple;

console.log("first:", first);
console.log("third with default:", third);
Basi del destructuring di array e oggetti — illustrazione 3

Il trucco dello scambio

Uno scambio su una sola riga evita di utilizzare una variabile temporanea.

// Swap values with destructuring
let a = "left";
let b = "right";

[a, b] = [b, a];

console.log("a:", a);
console.log("b:", b);
Basi del destructuring di array e oggetti — illustrazione 4

Nozioni di base sugli oggetti e rinomina

Gli oggetti corrispondono in base alla key. Rinomini con key: localName e aggiunga = default quando necessario.

// Object destructuring: assign by property name
const user = { name: "Ayla", level: 2, active: true };

// Basic
const { name, active } = user;

// Renaming and default
const { level: userLevel = 0 } = user;

console.log("name:", name);
console.log("active:", active);
console.log("userLevel:", userLevel);
Basi del destructuring di array e oggetti — illustrazione 5

Campi annidati (introduzione)

Può leggere i campi annidati in un unico passaggio. Mantenga i pattern semplici per facilitare la lettura su dispositivi mobili.

// Nested destructuring (keep it simple)
const config = {
  theme: { primary: "blue", contrast: "white" },
  flags: { compact: true }
};

const { theme: { primary }, flags: { compact } } = config;

console.log("primary:", primary);
console.log("compact:", compact);
Basi del destructuring di array e oggetti — illustrazione 6

Quiz sulla sintassi dello scambio

Verifica rapida: scambiare valori con il destructuring.

Basi del destructuring di array e oggetti — illustrazione 7

Riepilogo

Riepilogo: gli array vengono destrutturati in base alla posizione, gli oggetti in base alla chiave. Ha ignorato elementi, utilizzato valori predefiniti, rinominato chiavi e scambiato valori su una sola riga.

Basi del destructuring di array e oggetti — illustrazione 8

Domande Frequenti

La lezione «Basi del destructuring di array e oggetti» è gratuita?

Sì — il testo completo di «Basi del destructuring di array e oggetti» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso JavaScript Academy, passa a CoddyKit PRO. Il corso JavaScript Academy include 2 lezioni in totale.

Cosa imparerò in «Basi del destructuring di array e oggetti»?

Destructuring di array e oggetti: basi, elementi saltati, valori predefiniti, ridenominazione e un semplice trucco per lo scambio. Eserciti JavaScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare JavaScript Academy?

Non è richiesta alcuna esperienza precedente. JavaScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 1 di 2.

Quanto tempo richiede la lezione «Basi del destructuring di array e oggetti»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione JavaScript Academy?

Sì. Ogni lezione JavaScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

  1. Basi del destructuring di array e oggetti
  2. Rest e spread — array e oggetti idiomatici
← Torna a JavaScript Academy