Array-Destrukturierung

Teil des Abschnitts Logik & Ablauf der JavaScript-Journey von Coddy — Lektion 47 von 65.

Array-Destrukturierung ist eine bequeme Möglichkeit, mehrere Werte aus einem Array zu extrahieren und sie in einer einzigen Anweisung Variablen zuzuweisen. Sie verwendet eine Syntax, die die Struktur eines Array-Literals widerspiegelt.

Grundlegende Syntax:

const [a, b, c] = [1, 2, 3];
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3

Sie können Elemente überspringen:

const [a, , c] = [1, 2, 3];
console.log(a); // 1
console.log(c); // 3

Sie können Rest-Parameter verwenden, um die verbleibenden Elemente zu erfassen:

const [a, ...rest] = [1, 2, 3, 4, 5];
console.log(a);    // 1
console.log(rest); // [2, 3, 4, 5]

Sie können Standardwerte angeben:

const [a, b, c = 3] = [1, 2];
console.log(c); // 3

Aufgabe

Einfach

Erstellen Sie eine Funktion namens analyzeArray, die ein Array als Argument entgegennimmt. Die Funktion sollte Array-Destructuring verwenden, um das erste, zweite und letzte Element des Arrays zu extrahieren. Sie sollte ein Objekt mit den folgenden Eigenschaften zurückgeben:

first: Das erste Element des Arrays
second: Das zweite Element des Arrays
last: Das letzte Element des Arrays
restLength: Die Anzahl der verbleibenden Elemente im Array

Falls eines dieser Elemente nicht existiert, verwenden Sie Standardwerte von null.

Spickzettel

Array-Destructuring extrahiert mehrere Werte aus einem Array und weist sie Variablen in einer einzigen Anweisung zu:

const [a, b, c] = [1, 2, 3];
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3

Überspringen Sie Elemente, indem Sie leere Stellen lassen:

const [a, , c] = [1, 2, 3];
console.log(a); // 1
console.log(c); // 3

Verwenden Sie Rest-Parameter, um die verbleibenden Elemente zu erfassen:

const [a, ...rest] = [1, 2, 3, 4, 5];
console.log(a);    // 1
console.log(rest); // [2, 3, 4, 5]

Geben Sie Standardwerte für fehlende Elemente an:

const [a, b, c = 3] = [1, 2];
console.log(c); // 3

Probier es selbst

function analyzeArray(arr) {
  // Schreibe deinen Code hier
}

Teste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.

Array-Destrukturierung

Spickzettel

Alle Lektionen in Logik & Ablauf