Destruktive Zuweisung

Die destruktive Zuweisung (destructing assignment) ist eine Syntax, die es ermöglicht, Werte aus Arrays oder Objekten direkt Variablen zuzuweisen. Dies vereinfacht die Extraktion von Werten und kann den Code lesbarer und kompakter machen.

Im Zusammenhang mit Arrays bedeutet die destruktive Zuweisung, dass man mehrere Elemente eines Arrays gleichzeitig extrahieren und Variablen zuweisen kann, ohne explizit auf die Array-Indizes zugreifen zu müssen.

Syntax und grundlegende Beispiele

            Syntax
        
const [var1, var2, ...] = array;

            Beispiel
        
const items = ["one", "two", "three", "four"];
const [itemOne, itemTwo, itemThree] = items;

console.log(itemOne);
console.log(itemTwo);
console.log(itemThree);
one
two
three

Man kann auch bestimmte Elemente im Array überspringen, indem man einfach leere Kommas in der destruktiven Zuweisung lässt.

            Überspringen von Elementen
        
const items = ["one", "two", "three", "four", "five"];
const [itemOne, , itemThree, , itemFive] = items;

console.log(itemOne);
console.log(itemThree);
console.log(itemFive);
one
three
five

Standardwerte

Es ist möglich Standardwerte festzulegen, falls bestimmte Array-Elemente undefined oder nicht vorhanden sind.

            Überspringen von Elementen
        
const items = ["one", "two", "three", "four", "five"];
const [itemOne, itemTwo, ...itemRest] = items;

console.log(itemOne);
console.log(itemTwo);
console.log(itemRest);
one
two
[ 'three', 'four', 'five' ]

Vertauschen von Variablen

Eine interessante Anwendung der destruktiven Zuweisung ist die einfache Vertauschung von Variablenwerten ohne einer temporären Variable.

            Beispiel
        
let a = 5;
let b = 10;

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

console.log(a);
console.log(b);
10
5

Verschachtelte Arrays

Man kann die destruktive Zuweisung auch bei verschachtelten Arrays verwenden.

            Beispiel
        
const colors = ["red", ["green", "blue"], "yellow"];
const [colorOne, [colorTwo, colorThree], colorFour] = colors;

console.log(colorOne);
console.log(colorTwo);
console.log(colorThree);
console.log(colorFour);
red
green
blue
yellow

Abwesende Elemente

Es kann vorkommen, dass ein Element in einem Array nicht vorhanden ist. In diesem Fall erhält die destruktive Variable der Wert undefined.

            Beispiel
        
const items = ["one", "two"];
const [itemOne, itemTwo, itemThree] = items;

console.log(itemOne);
console.log(itemTwo);
console.log(itemThree);
one
two
undefined

navigation Navigation