V tomto kurzu se na příkladech dozvíte o přiřazení destrukce JavaScriptu.
Destrukturalizace JavaScriptu
Přiřazení destrukce zavedené v ES6 usnadňuje přiřazení hodnot pole a vlastností objektu k odlišným proměnným. Například
Before ES6:
// assigning object attributes to variables const person = ( name: 'Sara', age: 25, gender: 'female' ) let name = person.name; let age = person.age; let gender = person.gender; console.log(name); // Sara console.log(age); // 25 console.log(gender); // female
Z ES6:
// assigning object attributes to variables const person = ( name: 'Sara', age: 25, gender: 'female' ) // destructuring assignment let ( name, age, gender ) = person; console.log(name); // Sara console.log(age); // 25 console.log(gender); // female
Poznámka : Při destrukci objektu nezáleží na pořadí názvu.
Můžete například napsat výše uvedený program jako:
let ( age, gender, name ) = person; console.log(name); // Sara
Poznámka : Při ničení objektů byste měli používat stejný název proměnné jako odpovídající klíč objektu.
Například,
let (name1, age, gender) = person; console.log(name1); // undefined
Pokud chcete klíči objektu přiřadit různé názvy proměnných, můžete použít:
const person = ( name: 'Sara', age: 25, gender: 'female' ) // destructuring assignment // using different variable names let ( name: name1, age: age1, gender:gender1 ) = person; console.log(name1); // Sara console.log(age1); // 25 console.log(gender1); // female
Pole Destrukturalizace
Podobným způsobem můžete provést i destrukci pole. Například,
const arrValue = ('one', 'two', 'three'); // destructuring assignment in arrays const (x, y, z) = arrValue; console.log(x); // one console.log(y); // two console.log(z); // three
Přiřaďte výchozí hodnoty
Při použití destrukce můžete přiřadit výchozí hodnoty proměnným. Například,
let arrValue = (10); // assigning default value 5 and 7 let (x = 5, y = 7) = arrValue; console.log(x); // 10 console.log(y); // 7
Ve výše uvedeném programu má arrValue pouze jeden prvek. Proto,
- proměnná x bude 10
- proměnná y má výchozí hodnotu 7
Při destrukci objektů můžete předat výchozí hodnoty podobným způsobem. Například,
const person = ( name: 'Jack', ) // assign default value 26 to age if undefined const ( name, age = 26) = person; console.log(name); // Jack console.log(age); // 26
Prohození proměnných
V tomto příkladu jsou dvě proměnné zaměněny pomocí syntaxe přiřazení destrukce.
// program to swap variables let x = 4; let y = 7; // swapping variables (x, y) = (y, x); console.log(x); // 7 console.log(y); // 4
Přeskočit položky
Můžete přeskočit nechtěné položky v poli, aniž byste je přiřadili k lokálním proměnným. Například,
const arrValue = ('one', 'two', 'three'); // destructuring assignment in arrays const (x, , z) = arrValue; console.log(x); // one console.log(z); // three
Ve výše uvedeném programu je druhý prvek vynechán pomocí oddělovače čárek ,.
Přiřaďte zbývající prvky jedné proměnné
Zbývající prvky pole můžete přiřadit proměnné pomocí syntaxe šíření … . Například,
const arrValue = ('one', 'two', 'three', 'four'); // destructuring assignment in arrays // assigning remaining elements to y const (x,… y) = arrValue; console.log(x); // one console.log(y); // ("two", "three", "four")
Zde oneje přiřazena proměnné x. A zbytek prvků pole je přiřazen proměnné y.
Můžete také přiřadit zbytek vlastností objektu jedné proměnné. Například,
const person = ( name: 'Sara', age: 25, gender: 'female' ) // destructuring assignment // assigning remaining properties to rest let ( name,… rest ) = person; console.log(name); // Sara console.log(rest); // (age: 25, gender: "female")
Poznámka : Proměnná se syntaxí šíření nemůže mít koncovou čárku ,. Tento odpočinkový prvek (proměnná se syntaxí šíření) byste měli použít jako poslední proměnnou.
Například,
const arrValue = ('one', 'two', 'three', 'four'); // throws an error const (… x, y) = arrValue; console.log(x); // eror
Vnořené přiřazení k destrukci
Můžete provést vnořenou destrukci prvků pole. Například,
// nested array elements const arrValue = ('one', ('two', 'three')); // nested destructuring assignment in arrays const (x, (y, z)) = arrValue; console.log(x); // one console.log(y); // two console.log(z); // three
Zde jsou proměnné y a z přiřazeny vnořené prvky twoa three.
Aby bylo možné provést vnořené přiřazení destrukce, musíte proměnné uzavřít do struktury pole (uzavřením uvnitř ()).
Můžete také provést vnořenou destrukci vlastností objektu. Například,
const person = ( name: 'Jack', age: 26, hobbies: ( read: true, playGame: true ) ) // nested destructuring const (name, hobbies: (read, playGame)) = person; console.log(name); // Jack console.log(read); // true console.log(playGame); // true
Chcete-li provést vnořené přiřazení destrukce pro objekty, musíte uzavřít proměnné do struktury objektu (uzavřením uvnitř ()).
Poznámka : Funkce přiřazení destrukce byla zavedena v ES6 . Některé prohlížeče nemusí podporovat použití přiřazení ke zničení. Navštivte podporu pro destrukci Javascript a dozvíte se více.
