Šioje pamokoje sužinosite apie „JavaScript“ sunaikinimo užduotį pavyzdžių pagalba.
„JavaScript“ pertvarkymas
ES6 įdiegtas naikinamasis priskyrimas leidžia lengvai priskirti masyvo vertes ir objekto ypatybes skirtingiems kintamiesiems. Pavyzdžiui,
prieš 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
Iš 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
Pastaba : Pertvarkant objektą, pavadinimo tvarka nėra svarbi.
Pavyzdžiui, aukščiau nurodytą programą galite parašyti taip:
let ( age, gender, name ) = person; console.log(name); // Sara
Pastaba : Pertvarkydami objektus, kintamajam turėtumėte naudoti tą patį pavadinimą kaip ir atitinkamas objekto raktas.
Pavyzdžiui,
let (name1, age, gender) = person; console.log(name1); // undefined
Jei norite priskirti skirtingus objekto rakto kintamųjų pavadinimus, galite naudoti:
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
Masyvo pertvarkymas
Taip pat galite panašiai atlikti masyvo pertvarkymą. Pavyzdžiui,
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
Priskirti numatytąsias vertes
Naudodami destruktyvavimą, galite priskirti numatytąsias kintamųjų reikšmes. Pavyzdžiui,
let arrValue = (10); // assigning default value 5 and 7 let (x = 5, y = 7) = arrValue; console.log(x); // 10 console.log(y); // 7
Pirmiau pateiktoje programoje „arrValue“ turi tik vieną elementą. Taigi,
- x kintamasis bus 10
- y kintamasis gauna numatytąją 7 reikšmę
Pertvarkydami objektą, galite perduoti numatytąsias reikšmes panašiai. Pavyzdžiui,
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
Kintamųjų keitimas
Šiame pavyzdyje du kintamieji keičiami naudojant destruktyvaus priskyrimo sintaksę.
// program to swap variables let x = 4; let y = 7; // swapping variables (x, y) = (y, x); console.log(x); // 7 console.log(y); // 4
Praleisti elementus
Galite praleisti nepageidaujamus elementus iš masyvo, nepriskirdami jų vietiniams kintamiesiems. Pavyzdžiui,
const arrValue = ('one', 'two', 'three'); // destructuring assignment in arrays const (x, , z) = arrValue; console.log(x); // one console.log(z); // three
Pirmiau pateiktoje programoje antrasis elementas praleidžiamas naudojant kablelio skyriklį ,.
Priskirkite likusius elementus vienam kintamajam
Likusius masyvo elementus galite priskirti kintamajam naudodami išplitimo sintaksę … . Pavyzdžiui,
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")
Čia onepriskiriamas x kintamajam. Likę masyvo elementai priskiriami y kintamajam.
Likusias objekto ypatybes taip pat galite priskirti vienam kintamajam. Pavyzdžiui,
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")
Pastaba : Kintamasis su išplitimo sintakse negali turėti kablelio ,. Šį poilsio elementą (kintamąjį su išplitimo sintakse) turėtumėte naudoti kaip paskutinį kintamąjį.
Pavyzdžiui,
const arrValue = ('one', 'two', 'three', 'four'); // throws an error const (… x, y) = arrValue; console.log(x); // eror
Lizdinis restruktūrizavimo uždavinys
Galite atlikti įdėtą masyvo elementų pertvarkymą. Pavyzdžiui,
// 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
Čia kintamajam y ir z priskiriami įdėti elementai twoir three.
Norėdami įvykdyti įdėtą destruktyvumo užduotį, jūs turite įtraukti kintamuosius į masyvo struktūrą (įtraukdami vidų ()).
Taip pat galite atlikti įdėtą objekto ypatybių pertvarkymą. Pavyzdžiui,
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
Norėdami įvykdyti įdėtą objektų naikinimo užduotį, turite pridėti kintamuosius objekto struktūroje (įtraukdami vidų ()).
Pastaba : ES6 įdiegta priskyrimo pertvarkymo funkcija . Kai kurios naršyklės gali nepalaikyti sunaikinimo užduoties naudojimo. Norėdami sužinoti daugiau, apsilankykite „Javascript“ pertvarkymo palaikymo tarnyboje.
