Selles õpetuses saate näidete abil teada JavaScripti hävitamise ülesandest.
JavaScripti ümberkorraldamine
ES6-s juurutatud ümberkorraldamise omistamine hõlbustab massiivi väärtuste ja objekti omaduste määramist erinevatele muutujatele. Näiteks
enne 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
ES6-st:
// 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
Märkus . Objekti hävitamisel pole nime järjekord oluline.
Näiteks võite ülaltoodud programmi kirjutada järgmiselt:
let ( age, gender, name ) = person; console.log(name); // Sara
Märkus . Objektide restruktureerimisel peaksite muutuja jaoks kasutama sama nime kui vastav objektivõtme.
Näiteks,
let (name1, age, gender) = person; console.log(name1); // undefined
Kui soovite määrata objektivõtmele erinevad muutujate nimed, võite kasutada järgmist:
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
Massiivi ümberkorraldamine
Sarnasel viisil saate ka massiivi hajutada. Näiteks,
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
Määrake vaikeväärtused
Destruktureerimise abil saate määrata muutujate vaikeväärtused. Näiteks,
let arrValue = (10); // assigning default value 5 and 7 let (x = 5, y = 7) = arrValue; console.log(x); // 10 console.log(y); // 7
Ülaltoodud programmis on arrValue ainult üks element. Seega
- muutuja x on 10
- muutuja y võtab vaikeväärtuse 7
Objekti hävitamisel saate vaikeväärtused edastada sarnaselt. Näiteks,
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
Muutujate vahetamine
Selles näites vahetatakse kaks muutujat, kasutades omistamise hävitamise süntaksit.
// program to swap variables let x = 4; let y = 7; // swapping variables (x, y) = (y, x); console.log(x); // 7 console.log(y); // 4
Jäta üksused vahele
Massiivis saate soovimatud üksused vahele jätta, määramata neid kohalikele muutujatele. Näiteks,
const arrValue = ('one', 'two', 'three'); // destructuring assignment in arrays const (x, , z) = arrValue; console.log(x); // one console.log(z); // three
Ülaltoodud programmis jäetakse teine element vahele komaga eraldaja abil ,
.
Määrake ülejäänud muutujad ühele muutujale
Massiivi ülejäänud elemendid saate muutujale määrata hajutussüntaksiga …
. Näiteks,
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")
Siin one
määratakse muutujale x. Ja ülejäänud massiivi elemendid määratakse muutujale y.
Ülejäänud objekti atribuudid saate määrata ka ühele muutujale. Näiteks,
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")
Märkus . Hajutussüntaksiga muutujal ei tohi olla koma ,
. Peaksite seda ülejäänud elementi (muutuja koos leviku süntaksiga) kasutama viimase muutujana.
Näiteks,
const arrValue = ('one', 'two', 'three', 'four'); // throws an error const (… x, y) = arrValue; console.log(x); // eror
Pesastatud ümberkorraldamise ülesanne
Massiivielementide jaoks saate läbi viia pesastatud ümberstruktureerimise. Näiteks,
// 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
Siin omistatakse muutujale y ja z pesastatud elemendid two
ja three
.
Pesastatud hävitamisülesande täitmiseks peate muutujad massiivistruktuuri (sisestades selle sisse ()
).
Objekti omaduste jaoks saate teha ka pesastatud ümberstruktureerimise. Näiteks,
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
Objektide sisestatud hävitamise määramise täitmiseks peate muutujad objektistruktuuri (sisestades selle sisse ()
).
Märkus . ES6-s võeti kasutusele ülesande ümberkorraldamise funktsioon . Mõni brauser ei pruugi destruktsioonülesande kasutamist toetada. Lisateabe saamiseks külastage Javascripti ümberkorraldamise tugiteenust.