Šajā apmācībā jūs uzzināsit par JavaScript iznīcināšanas uzdevumu, izmantojot piemērus.
JavaScript pārstrukturēšana
ES6 ieviestais pārstrukturēšanas uzdevums atvieglo masīva vērtību un objekta īpašību piešķiršanu atšķirīgiem mainīgajiem. Piemēram,
pirms 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
No 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
Piezīme : Objekta iznīcināšanā nosaukuma secībai nav nozīmes.
Piemēram, jūs varat uzrakstīt iepriekš minēto programmu šādi:
let ( age, gender, name ) = person; console.log(name); // Sara
Piezīme . Pārstrukturējot objektus, mainīgajam jāizmanto tāds pats nosaukums kā atbilstošajai objekta atslēgai.
Piemēram,
let (name1, age, gender) = person; console.log(name1); // undefined
Ja objekta atslēgai vēlaties piešķirt dažādus mainīgo nosaukumus, varat izmantot:
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
Masīva pārstrukturēšana
Varat arī līdzīgā veidā veikt masīvu iznīcināšanu. Piemēram,
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
Piešķirt noklusējuma vērtības
Izmantojot pārstrukturēšanu, mainīgajiem var piešķirt noklusējuma vērtības. Piemēram,
let arrValue = (10); // assigning default value 5 and 7 let (x = 5, y = 7) = arrValue; console.log(x); // 10 console.log(y); // 7
Iepriekš minētajā programmā arrValue ir tikai viens elements. Tādējādi
- x mainīgais būs 10
- y mainīgais iegūst noklusējuma vērtību 7
Objekta iznīcināšanas gadījumā jūs varat noklusējuma vērtības nodot līdzīgā veidā. Piemēram,
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
Mainīgo mainīšana
Šajā piemērā divi mainīgie tiek apmainīti, izmantojot destrukturējošās piešķiršanas sintaksi.
// program to swap variables let x = 4; let y = 7; // swapping variables (x, y) = (y, x); console.log(x); // 7 console.log(y); // 4
Izlaist vienumus
Jūs varat izlaist nevēlamus masīva vienumus, nepiešķirot tos vietējiem mainīgajiem. Piemēram,
const arrValue = ('one', 'two', 'three'); // destructuring assignment in arrays const (x, , z) = arrValue; console.log(x); // one console.log(z); // three
Iepriekš minētajā programmā otrais elements tiek izlaists, izmantojot komatu atdalītāju ,.
Piešķiriet atlikušos elementus vienam mainīgajam
Pārējos masīva elementus var piešķirt mainīgajam, izmantojot izplatīšanas sintaksi … . Piemēram,
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")
Šeit onetiek piešķirts mainīgajam x. Un pārējie masīva elementi tiek piešķirti y mainīgajam.
Varat arī piešķirt pārējos objekta rekvizītus vienam mainīgajam. Piemēram,
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")
Piezīme . Mainīgajam ar izplatības sintaksi nevar būt komats ,. Jums vajadzētu izmantot šo atpūtas elementu (mainīgo ar izplatīšanās sintaksi) kā pēdējo mainīgo.
Piemēram,
const arrValue = ('one', 'two', 'three', 'four'); // throws an error const (… x, y) = arrValue; console.log(x); // eror
Ligzdots pārstrukturēšanas uzdevums
Jūs varat veikt ligzdotu masīva elementu pārstrukturēšanu. Piemēram,
// 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
Šeit mainīgajam y un z tiek piešķirti ligzdoti elementi twoun three.
Lai izpildītu ligzdoto iznīcināšanas uzdevumu, mainīgie jāievieto masīva struktūrā (iekļaujot iekšpusē ()).
Varat arī veikt ligzdotu objektu īpašību pārstrukturēšanu. Piemēram,
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
Lai izpildītu ligzdoto objektu pārstrukturēšanas uzdevumu, mainīgie jāiekļauj objekta struktūrā (iekļaujot iekšpusē ()).
Piezīme : Piešķiršanas pārstrukturēšanas funkcija tika ieviesta ES6 . Dažas pārlūkprogrammas var neatbalstīt pārstrukturēšanas uzdevuma izmantošanu. Apmeklējiet Javascript pārstrukturēšanas atbalstu, lai uzzinātu vairāk.
