10. Destructuring

BY admin
|

10. Destructuring #

  • 10.1. Yleiskatsaus
    • 10. 1.1. Kohteen tuhoutuminen
    • 10.1.2. Array destructing
    • 10.1.3. Missä tuhoamista voidaan käyttää?
  • 10.2. Tausta: Konstruktiotiedot vs. talteen otetut tiedot
  • 10.3.
    • 10.3.1. Valitse mitä tarvitset
  • 10.4. Miten kuviot pääsevät arvojen sisuksiin?
    • 10.4.1. Objektikuviot pakottavat arvot kohteille
    • 10.4.2. Array kuviot toimivat iterables
  • 10.5. Oletusarvot
    • 10.5.1. undefined laukaisee oletusarvot
    • 10.5.2. Oletusarvot lasketaan vaadittaessa
    • 10.5.3. Oletusarvot voivat viitata muihin muuttujiin kaavassa
    • 10.5.4. Oletusarvot kuvioille
    • 10.5.5. Monimutkaisemmat oletusarvot
  • 10.6. Lisää objektin tuhoamisominaisuuksia
    • 10.6.1. Kiinteistön arvo lyhenne
    • 10.6.2. Laskennalliset ominaisuusavaimet
  • 10.7. Lisää matriisien tuhoamisominaisuuksia
    • 10.7.1. Elision
    • 10, 7, 2. Lepotoiminnan harjoittaja (...)
  • 10.8. Voit määrittää muitakin kuin muuttujia
  • 10.9. Tuhon sudenkuopat
    • 10.9.1. Älä aloita lausuntoa kiharatukilla
  • 10.10. Esimerkkejä tuhoamisesta
    • 10.10.1. Destructing returned Arrays
    • 10.10.2. Destruction palautetut kohteet
    • 10.10.3. Array-destructing iterable values
    • 10.10.4. Useita palautusarvoja
  • 10.11. Tuhoamisalgoritmi
    • 10.11.1. Algoritmi
    • 10.11.2. Algoritmin soveltaminen

10.1 yleiskatsaus #

Destructuring on kätevä tapa saada useita arvoja (mahdollisesti sisäkkäisiin) esineisiin ja ryhmiin tallennetuista tiedoista. Sitä voidaan käyttää paikoissa, jotka vastaanottavat tietoja (kuten tehtävän vasemmalla puolella). Kuinka purkaa arvot on määritelty kautta kuvioita (Lue esimerkkejä).

10.1.1 Object destructing #

destructing objects:

const obj = { first: 'Jane', last: 'Doe' };const {first: f, last: l} = obj; // f = 'Jane'; l = 'Doe'// {prop} is short for {prop: prop}const {first, last} = obj; // first = 'Jane'; last = 'Doe'

Destructuring auttaa paluuarvojen käsittelyssä:

const obj = { foo: 123 };const {writable, configurable} = Object.getOwnPropertyDescriptor(obj, 'foo');console.log(writable, configurable); // true true

10.1.2 Array destructuring #

Array destructuring (toimii kaikille iteroitaville arvoille):

const iterable = ;const  = iterable; // x = 'a'; y = 'b'

Destructuring auttaa paluuarvojen käsittelyssä:

const  = /^(\d\d\d\d)-(\d\d)-(\d\d)$/ .exec('2999-12-31');

10.1.3 missä tuhoamista voidaan käyttää? #

Destructuring voidaan käyttää seuraavissa paikoissa (I ’ m showing Array patterns to demonstrate; object patterns work just well):

// Variable declarations:const  = ;let  = ;var  = ;// Assignments: = ;// Parameter definitions:function f() { ··· }f();

voit tuhota myös for-of – silmukassa:

const arr = ;for (const  of arr.entries()) { console.log(index, element);}// Output:// 0 a// 1 b

10.2 Tausta: Construction data versus extracting data #

to fully understand what destructuring is, let ’ s first examinate its whole context.

Javascriptillä on toiminnot datan rakentamiseen, yksi ominaisuus kerrallaan:

const obj = {};obj.first = 'Jane';obj.last = 'Doe';

samalla syntaksilla voidaan purkaa dataa. Jälleen yksi kiinteistö kerrallaan:

const f = obj.first;const l = obj.last;

lisäksi on olemassa syntaksi, jolla voidaan rakentaa useita ominaisuuksia samanaikaisesti objektin kirjaimella:

const obj = { first: 'Jane', last: 'Doe' };

ennen ES6: ta ei ollut vastaavaa mekanismia tietojen keräämiseen. Sitä destructuring on-sen avulla voit poimia useita ominaisuuksia objektin kautta objekti kuvio. Esimerkiksi tehtävän vasemmalla puolella:

const { first: f, last: l } = obj;

Voit myös tuhota matriiseja kuvioiden avulla:

const  = ; // x = 'a'; y = 'b'

10.3 Patterns for destructuring #

seuraavat kaksi osapuolta ovat mukana destructoinnissa:

  • destructing lähde: tiedot tuhottava. Esimerkiksi tuhoamistehtävän oikealla puolella.
  • destructing target: the pattern used for destructuring. Esimerkiksi tuhoamistehtävän vasen puoli.

tuhoava kohde on joko yksi kolmesta kuviosta:

  • tehtävä kohde. Esimerkiksi: x
    • tehtäväkohde on yleensä muuttuja. Mutta tuhoamistehtävässä sinulla on enemmän vaihtoehtoja, kuten Selitän myöhemmin.
  • Esinekuvio. Esimerkiksi: { first: "pattern", last: "pattern" }
    • objektikuvion osat ovat ominaisuuksia, ominaisuuden arvot taas kuvioita (rekursiivisesti).
  • Ryhmäkuvio. Esimerkiksi:
    • Array-kuvion osat ovat elementtejä, elementit taas kuvioita (rekursiivisesti).

se tarkoittaa, että voit pesiä kuvioita, mielivaltaisesti syvästi:

const obj = { a: , b: true };const { a:  } = obj; // f = 123

10.3.1 Pick what you need #

jos tuhoat kohteen, mainitset vain ne ominaisuudet, joista olet kiinnostunut:

const { x: x } = { x: 7, y: 3 }; // x = 7

jos tuhoat Array, voit valita vain purkaa etuliite:

const  = ; // x='a'; y='b';

10.4 miten kuviot pääsevät arvojen sisuksiin? #

tehtävässä pattern = someValue, miten pattern pääsee käsiksi siihen, mitä on sisällä someValue?

10.4.1 Objektikuviot pakottavat arvot kohteille #

objektikuviot pakottavat destruoimaan lähteet esineille ennen ominaisuuksien käyttöä. Se tarkoittaa, että se toimii primitiivisillä arvoilla:

const {length : len} = 'abc'; // len = 3const {toString: s} = 123; // s = Number.prototype.toString

10.4.1.1 jos arvoa #

ei voida object-destructioida, pakko ei tapahdu Object() kautta, vaan sisäisen operaation kautta ToObject(). Nämä kaksi operaatiota käsittelevät undefined ja null eri tavalla.

Object() muuntaa alkeelliset arvot kääreesineiksi ja jättää esineet koskemattomiksi:

> typeof Object('abc')'object'> var obj = {};> Object(obj) === objtrue

It also converts undefined and null to empty objects:

> Object(undefined){}> Object(null){}

In contrast, ToObject() throws a TypeError if it encounters undefined or null. Therefore, the following destructurings fail, even before destructuring accesses any properties:

const { prop: x } = undefined; // TypeErrorconst { prop: y } = null; // TypeError

tämän seurauksena voit käyttää tyhjää objektikuviota {} tarkistaaksesi, onko jokin arvo pakotettavissa objektiin. Kuten olemme nähneet, vain undefined ja null eivät ole:

({} = ); // OK, Arrays are coercible to objects({} = 'abc'); // OK, strings are coercible to objects({} = undefined); // TypeError({} = null); // TypeError

sulut lausekkeiden ympärillä ovat tarpeen, koska lauseet eivät saa alkaa javascriptissä curly-henkseleillä (yksityiskohdat selitetään myöhemmin).

10.4.2 Array patterns work with iterables #

Array destructuring käyttää iteraattoria päästäkseen lähteen elementteihin. Siksi, voit Array-tuhota minkä tahansa arvon, joka on iteroitavissa. Katsotaanpa esimerkkejä toistettavissa arvoista.

merkkijonot ovat iteroitavia:

const  = 'abc'; // x='a'; y=

älä unohda, että iteraattori merkkijonojen yli palauttaa koodipisteitä (”Unicode-merkit”, 21 bittiä), ei koodiyksiköitä (”JavaScript-merkit”, 16 bittiä). (Lisätietoja Unicodesta on luvussa ” Luku 24. Unicode ja JavaScript ”in”Speaking JavaScript”.) Esimerkiksi:

const  = 'a\uD83D\uDCA9c'; // x='a'; y='\uD83D\uDCA9'; z='c'

et voi käyttää joukon elementtejä indeksien kautta, mutta voit tehdä sen iteraattorin kautta. Siksi Array destructing toimii sarjaa:

const  = new Set(); // x='a'; y='b';

Set iteraattori palauttaa aina elementit siinä järjestyksessä, jossa ne on asetettu, minkä vuoksi edellisen destruktion tulos on aina sama.

10.4.2.1 jos arvoa #

ei pystytä Array-destructure, arvo on iteroitavissa, jos sillä on menetelmä, jonka avain on Symbol.iterator, joka palauttaa objektin. Array-destructuring heittää TypeError, jos tuhottava arvo ei ole iteroitavissa:

let x; = ; // OK, Arrays are iterable = 'abc'; // OK, strings are iterable = { * () { yield 1 } }; // OK, iterable = {}; // TypeError, empty objects are not iterable = undefined; // TypeError, not iterable = null; // TypeError, not iterable

TypeError heitetään jo ennen iteroitavan elementtien käyttämistä, mikä tarkoittaa, että tyhjän Array-kuvion avulla voidaan tarkistaa, onko arvo iteroitavissa:

 = {}; // TypeError, empty objects are not iterable = undefined; // TypeError, not iterable = null; // TypeError, not iterable

10.5 oletusarvot #

oletusarvot ovat mallien valinnainen ominaisuus. Ne tarjoavat varasuunnitelman, jos lähteestä ei löydy mitään. Jos osa (objektin ominaisuus tai Matriisielementti) ei täsmää lähteessä, se täsmää:

  • sen oletusarvo (jos määritetty; se on vapaaehtoista.)
  • undefined ( muuten)

Katsotaanpa esimerkkiä. Seuraavassa destruktiossa indeksissä 0 olevalla alkuaineella ei ole vastaavuutta oikealla puolella. Siksi destructuring jatkuu sovittamalla x vastaan 3, jolloin x asetetaan arvoon 3.

const  = ; // x = 3; y = undefined

voit myös käyttää oletusarvoja objektikuvioissa:

const {foo: x=3, bar: y} = {}; // x = 3; y = undefined

10.5.1 undefined käynnistimien oletusarvoja #

oletusarvoja käytetään myös, jos osalla on vastaavuus ja kyseinen vastaavuus on undefined:

const  = ; // x = 1const {prop: y=2} = {prop: undefined}; // y = 2

tämän käyttäytymisen perustelut selitetään seuraavassa luvussa, parametrin oletusarvoja koskevassa jaksossa.

10.5.2 oletusarvot lasketaan vaadittaessa #

itse oletusarvot lasketaan vain, kun niitä tarvitaan. Toisin sanoen, tämä destructuring:

const {prop: y=someFunc()} = someValue;

vastaa:

let y;if (someValue.prop === undefined) { y = someFunc();} else { y = someValue.prop;}

voit tarkkailla, että jos käytät console.log():

> function log(x) { console.log(x); return 'YES' }> const = ;> a'YES'> const = ;> b123

In the second destructuring, the default value is not triggered and log() is not called.

10.5.3 Default values can refer to other variables in the pattern #

A default value can refer to any variable, including other variables in the same pattern:

const  = ; // x=3; y=3const  = ; // x=7; y=7const  = ; // x=7; y=2

järjestyksellä on kuitenkin väliä: muuttujat x ja y ilmoitetaan vasemmalta oikealle ja saadaan ReferenceError, jos ne ovat käytettävissä ennen niiden ilmoituksia:

const  = ; // ReferenceError

10.5.4 kuvioiden oletusarvot #

toistaiseksi olemme nähneet vain muuttujien oletusarvot, mutta voit myös liittää ne kuvioihin:

const  = ;

mitä tämä tarkoittaa? Palauta mieleesi oletusarvojen sääntö: Jos osa ei vastaa lähdettä, destructuring jatkuu oletusarvolla.

alkuaineella indeksissä 0 ei ole vastaavuutta, minkä vuoksi destructuring jatkuu:

const { prop: x } = {}; // x = undefined

voit helpommin nähdä, miksi asiat toimivat näin, jos korvaat kuvion { prop: x } muuttujalla pattern:

const  = ;

10.5.5 monimutkaisempia oletusarvoja #

tarkastellaan edelleen mallien oletusarvoja. Seuraavassa esimerkissä annamme arvon x oletusarvon { prop: 123 }kautta:

const  = ;

koska Matriisielementti indeksissä 0 ei täsmää oikealla puolella, destructuring jatkuu seuraavasti ja x on asetettu arvoon 123.

const { prop: x } = { prop: 123 }; // x = 123

x ei kuitenkaan anneta arvoa tällä tavalla, jos oikealla puolella on elementti indeksissä 0, koska silloin oletusarvo ei laukea.

const  = ;

tällöin destructuring jatkuu:

const { prop: x } = {}; // x = undefined

Jos siis haluat x olevan 123, jos joko esine tai ominaisuus puuttuu, sinun täytyy määrittää oletusarvo x itse:

const  = ;

tässä destruointi jatkuu seuraavasti riippumatta siitä, onko oikealla puolella vai .

const { prop: x=123 } = {}; // x = 123

10.6 more object destructing features #

10.6.1 Property value shorthands #

Property value shorthands are a feature of object literals: Jos ominaisuuden arvo on muuttuja, jolla on sama nimi kuin ominaisuusavaimella, voit jättää avaimen pois. Tämäkin toimii tuhoamiseen:

const { x, y } = { x: 11, y: 8 }; // x = 11; y = 8// Same as:const { x: x, y: y } = { x: 11, y: 8 };

voit myös yhdistää kiinteistön arvon pikanäppäimet oletusarvojen kanssa:

const { x, y = 1 } = {}; // x = undefined; y = 1

10.6.2 Computed property keys #

Computed property keys on toinen objektin kirjaimellinen ominaisuus, joka toimii myös destructuring. Voit määrittää ominaisuuden avaimen lausekkeen kautta, jos laitat sen hakasulkeisiin:

const FOO = 'foo';const { : f } = { foo: 123 }; // f = 123

Computed ominaisuus avaimet voit tuhota ominaisuuksia, joiden avaimet ovat symboleja:

// Create and destructure a property whose key is a symbolconst KEY = Symbol();const obj = { : 'abc' };const { : x } = obj; // x = 'abc'// Extract Array.prototypeconst { : func } = ;console.log(typeof func); // function

10.7 lisää matriisien destructuring features #

10.7.1 Elision #

Elision antaa sinun käyttää matriisien ”reikien” syntaksia ohittaaksesi elementtejä destructuringin aikana:

const  = ; // x = 'c'; y = 'd'

10.7.2 Lepotoiminnan harjoittaja (...) #

rest operator voit poimia loput elementit iterable osaksi Array. Jos tätä operaattoria käytetään Array-kuvion sisällä, sen on tultava viimeiseksi:

const  = ; // x='a'; y=

jos operaattori ei löydä mitään elementtejä, se vastaa sen operandi vastaan tyhjä Array. Toisin sanoen se ei koskaan tuota undefined tai null. Esimerkiksi:

const  = ; // x='a'; y=undefined; z=

rest-operaattorin operandin ei tarvitse olla muuttuja, voit käyttää myös kuvioita:

const ] = ; // x = 'a'; y = 'b'; z = 'c'

lepooperaattori laukaisee seuraavan tuhon:

 =

10.8 voit määrittää muullekin kuin muuttujille #

jos määrität destructuringin kautta, jokainen määrityskohde voi olla kaikki mikä on sallittua normaalin tehtävän vasemmalla puolella.

esimerkiksi viittaus kiinteistöön (obj.prop):

const obj = {};({ foo: obj.prop } = { foo: 123 });console.log(obj); // {prop:123}

tai viittaus Matriisielementtiin (arr):

const arr = ;({ bar: arr } = { bar: true });console.log(arr); //

voit myös määrittää kohteen ominaisuudet ja Array-elementit rest-operaattorin kautta (...):

const obj = {}; = ; // first = 'a'; obj.prop =

jos julistat muuttujat tai määrität parametrit destructuring-toiminnon avulla, sinun on käytettävä yksinkertaisia tunnisteita, et voi viitata objektin ominaisuuksiin ja Array-elementteihin.

10.9 destruoinnin sudenkuopat #

on kaksi asiaa, jotka on muistettava destruointia käytettäessä:

  • lausuntoa ei voi aloittaa kiharatukella.
  • destruoinnin aikana voi joko julistaa muuttujia tai antaa niille, mutta ei molempia.

kahdessa seuraavassa osassa on yksityiskohtia.

10.9.1 Älä aloita lausetta kihara ahdin #

koska koodilohkot alkavat kihara ahdin, lauseet eivät saa alkaa yhdellä. Tämä on valitettavaa, kun käytetään objektin tuhoamista tehtävässä:

{ a, b } = someObject; // SyntaxError

työ-around on laittaa koko ilmaus suluissa:

({ a, b } = someObject); // OK

seuraava syntaksi ei toimi:

({ a, b }) = someObject; // SyntaxError

let, var ja const kihara hammasraudat eivät koskaan aiheuta ongelmia:

const { a, b } = someObject; // OK

10.10 Examples of destructuring #

aloitetaan muutamalla pienemmällä esimerkillä.

for-of silmukka tukee destruointia:

const map = new Map().set(false, 'no').set(true, 'yes');for (const  of map) { console.log(key + ' is ' + value);}

voit käyttää destructuring vaihtaa arvoja. Se on jotain, että moottorit voisivat optimoida, jotta mitään Array olisi luotu.

 = ;

voit käyttää destructuring jakaa Array:

const  = ; // first = 'a'; rest =

10.10.1 destructing returned Arrays #

Some built-in JavaScript operations return Arrays. Destructuring auttaa niiden käsittelyssä:

const  = /^(\d\d\d\d)-(\d\d)-(\d\d)$/ .exec('2999-12-31');

jos olet kiinnostunut vain ryhmistä (eikä täydellisestä ottelusta, all), voit ohittaa array-elementin indeksissä elisionin avulla 0:

const  = /^(\d\d\d\d)-(\d\d)-(\d\d)$/ .exec('2999-12-31');

exec() palauttaa null, jos säännöllinen lauseke ei täsmää. Valitettavasti et voi käsitellä null oletusarvojen kautta, minkä vuoksi sinun on käytettävä Or-operaattoria (||) tässä tapauksessa.:

const  = /^(\d\d\d\d)-(\d\d)-(\d\d)$/ .exec(someStr) || ;

Array.prototype.split() palauttaa antenniryhmän. Siksi destructuring on hyödyllinen, jos olet kiinnostunut elementtejä, ei Array:

const cells = 'Jane\tDoe\tCTO'const  = cells.split('\t');console.log(firstName, lastName, title);

10.10.2 Destructuring palautetut objektit #

Destructuring on hyödyllinen myös datan purkamiseen kohteista, jotka palautetaan funktioilla tai menetelmillä. Esimerkiksi iteraattorimenetelmä next() palauttaa kohteen, jolla on kaksi ominaisuutta, done ja value. Seuraava koodi kirjaa kaikki matriisin arr alkuaineet iteraattorin iterkautta. Destruointia käytetään A-linjalla.

const arr = ;const iter = arr();while (true) { const {done,value} = iter.next(); // (A) if (done) break; console.log(value);}

10.10.3 Array-destructuring iterable values #

Array-destructuring toimii millä tahansa iteroituvalla arvolla. Siitä on joskus hyötyä:

const  = new Set().add('a').add('b'); // x = 'a'; y = 'b'const  = 'foo'; // a = 'f'; b = 'o'

10.10.4 moninkertaiset palautusarvot #

jotta voidaan nähdä useiden palautusarvojen hyödyllisyys, toteutetaan funktio findElement(a, p), joka etsii joukon ensimmäistä elementtiä a, jolle funktio p palauttaa true. Kysymys kuuluu: mitä pitäisi findElement() palauttaa? Joskus on kiinnostunut itse elementistä, joskus sen indeksistä, joskus molemmista. Seuraava toteutus palauttaa molemmat.

function findElement(array, predicate) { for (const  of array.entries()) { // (A) if (predicate(element, index, array)) { // We found an element: return { element, index }; // Same as (property value shorthands): // { element: element, index: index } } } // We couldn't find anything; return failure values: return { element: undefined, index: -1 };}

funktio iteroi kaikkien array: n alkioiden päälle Array-menetelmällä entries(), joka palauttaa iteroitavan yli paria (rivi a). Parien osiin pääsee käsiksi tuhoamalla.

käytetään findElement():

const arr = ;const {element, index} = findElement(arr, x => x % 2 === 0); // element = 8, index = 1

useiden ECMAScript 6-ominaisuuksien avulla pystyimme kirjoittamaan suppeamman koodin: takaisinsoitto on nuolifunktio; palautusarvo tuhotaan objektikuviolla, jossa on ominaisuusarvon pikakirjoituksia.

koska index ja element viittaavat myös omaisuusavaimiin, sillä, missä järjestyksessä ne mainitaan, ei ole väliä. Voimme vaihtaa niitä, eikä mikään muutu.:

const {index, element} = findElement(···);

olemme onnistuneesti käsitelleet tapausta, jossa tarvitaan sekä indeksiä että elementtiä. Entä jos olemme kiinnostuneita vain yhdestä niistä? On käynyt ilmi, että ECMAScript 6: n ansiosta toteutuksemme voi hoitaa senkin. Ja syntaktiset yleiskustannukset verrattuna funktioihin, joilla on yksi paluuarvo, ovat minimaaliset.

const a = ;const {element} = findElement(a, x => x % 2 === 0); // element = 8const {index} = findElement(a, x => x % 2 === 0); // index = 1

joka kerta saamme vain yhden kiinteistön arvon.

10.11 destructuring algorithm #

tässä jaksossa tarkastellaan destructuring from a different angle: as a recursive pattern matching algorithm.

lopussa selitän algoritmin avulla eron seuraavien kahden funktioilmoituksen välillä.

function move({x=0, y=0} = {}) { ··· }function move({x, y} = { x: 0, y: 0 }) { ··· }

10.11.1 algoritmi #

a destructuring assignment looks like this:

"pattern" = "value"

haluamme pattern: n avulla poimia tietoja value: stä. Minä nyt kuvata algoritmi tehdä niin, joka tunnetaan funktionaalinen ohjelmointi pattern matching (lyhyt: matching). Algoritmi määrittää destruointitoimeksiannolle operaattorin ← (”match against”), joka vastaa arvoa pattern kohtaa a value ja määrittää muuttujille samalla:

"pattern" ← "value"

algoritmi määritellään rekursiivisilla säännöillä, jotka purkavat ← operaattorin molemmat operandit. Deklaratiiviseen notaatioon voi tottua, mutta se tekee algoritmin erittelystä tiiviimmän. Jokaisessa säännössä on kaksi osaa:

  • Pää (ensimmäinen rivi) kuvaa tilan, joka laukaisee säännön.
  • keho (jäljellä olevat viivat) kuvaa, mitä tapahtuu, jos sääntö laukeaa.

katsotaanpa esimerkkiä:

  • (2c) {key: "pattern", "properties"} ← obj
     "pattern" ← obj.key {"properties"} ← obj
  • (2e) {} ← obj (Ei ominaisuuksia jäljellä)
     // Nothing to do

säännössä (2C) pää tarkoittaa, että tämä sääntö suoritetaan, jos on objektikuvio, jossa on vähintään yksi ominaisuus ja nolla tai useampia jäljellä olevia ominaisuuksia. Tätä kuviota vastaa arvo obj. Tämän säännön vaikutus on se, että toteutus jatkuu niin, että kiinteistön arvomalli on sovitettu vastaan obj.key ja loput ominaisuudet on sovitettu vastaan obj.

säännössä (2e) pää tarkoittaa, että tämä sääntö toteutetaan, jos tyhjän objektin kuvio {} vastaa arvoa obj. Sitten ei ole mitään tehtävissä.

aina kun algoritmiin vedotaan, tarkistetaan säännöt ylhäältä alas ja suoritetaan vain ensimmäinen sovellettava sääntö.

näytän vain algoritmin destructuring-tehtävälle. Destructing muuttuja ilmoitukset ja destructing parametri määritelmät toimivat samoin.

I don ’ t cover advanced features (computed property keys; property value shorthands; object properties and array elements as assignment targets), joko. Vain perusasiat.

10.11.1.1 Patterns #

a pattern is either:

  • muuttuja: x
  • objektikuvio: {"properties"}
  • Array kuvio:

kussakin seuraavassa jaksossa kuvataan yksi näistä kolmesta tapauksesta.

seuraavissa kolmessa osassa täsmennetään, miten nämä kolme tapausta käsitellään. Jokaisessa jaksossa on yksi tai useampi numeroitu sääntö.

10.11.1.2 muuttuja #
  • (1) x ← value (mukaan lukien undefined ja null)
     x = value
10.11.1.3 Objektikuvio #
  • (2a) {"properties"} ← undefined
     throw new TypeError();
  • (2 B) {"properties"} ← null
     throw new TypeError();
  • (2c) {key: "pattern", "properties"} ← obj
     "pattern" ← obj.key {"properties"} ← obj
  • (2d) {key: "pattern" = default_value, "properties"} ← obj
     const tmp = obj.key; if (tmp !== undefined) { "pattern" ← tmp } else { "pattern" ← default_value } {"properties"} ← obj
  • (2e) {} ← obj (Ei ominaisuuksia jäljellä)
     // Nothing to do
10.11.1.4 Array pattern #

Array pattern and iterable. Matriisien tuhoamisalgoritmi alkaa Matriisikuviolla ja iteroituvalla:

  • (3a) ← non_iterable
    assert(!isIterable(non_iterable))
     throw new TypeError();
  • (3 B) ← iterable
    assert(isIterable(iterable))
     const iterator = iterable(); "elements" ← iterator

Auttajatoiminto:

function isIterable(value) { return (value !== null && typeof value === 'object' && typeof value === 'function');}

Array elementtejä ja iteraattori. Algoritmi jatkuu kuvion elementeillä (nuolen vasemmalla puolella) ja iteraattorilla, joka saatiin iteroitavasta (nuolen oikealla puolella).

  • (3c) "pattern", "elements" ← iterator
     "pattern" ← getNext(iterator) // undefined after last item "elements" ← iterator
  • (3d) "pattern" = default_value, "elements" ← iterator
     const tmp = getNext(iterator); // undefined after last item if (tmp !== undefined) { "pattern" ← tmp } else { "pattern" ← default_value } "elements" ← iterator
  • (3e) , "elements" ← iterator (hole, elision)
     getNext(iterator); // skip "elements" ← iterator
  • (3f) ..."pattern" ← iterator (aina viimeinen osa!)
     const tmp = ; for (const elem of iterator) { tmp.push(elem); } "pattern" ← tmp
  • (3g) ← iterator (ei elementtejä jäljellä)
     // Nothing to do

Auttajatoiminto:

function getNext(iterator) { const {done,value} = iterator.next(); return (done ? undefined : value);}

10.11.2 soveltamalla algoritmia #

ECMAScript 6: ssa voi simuloida nimettyjä parametreja, jos soittaja käyttää objektia kirjaimellisena ja callee käyttää destructuringia. Tämä simulaatio selitetään yksityiskohtaisesti luvussa parametrien käsittely. Seuraava koodi näyttää esimerkin: funktiolla move1() on kaksi nimettyä parametria, x ja y:

function move1({x=0, y=0} = {}) { // (A) return ;}move1({x: 3, y: 8}); // move1({x: 3}); // move1({}); // move1(); //

rivillä A on kolme oletusarvoa:

  • kahdesta ensimmäisestä oletusarvosta voi jättää pois x ja y.
  • kolmannen oletusarvon avulla voi soittaa move1() ilman parametreja (kuten viimeisellä rivillä).

mutta miksi määrittelit parametrit kuten edellisessä koodinpätkässä? Miksi ei seuraavasti-joka on myös täysin laillinen ES6-koodi?

function move2({x, y} = { x: 0, y: 0 }) { return ;}

nähdäksemme, miksi move1() on oikea, käytetään molempia funktioita kahteen esimerkkiin. Ennen kuin teemme, katsotaanpa, miten kulkee parametrien voidaan selittää kautta matching.

10.11.2.1 Tausta: funktiokutsuissa formaalit parametrit (funktioiden sisäpiirimääritelmät) sovitetaan todellisiin parametreihin (funktioiden sisäpuhelut). Otetaan esimerkiksi seuraava funktion määritelmä ja seuraava funktiokutsu. 

function func(a=0, b=0) { ··· }func(1, 2);

parametrit a ja b asetetaan samalla tavalla kuin seuraava Destruction.

 ←
10.11.2.2 käyttö move2() #

tarkastellaan, miten destructuring toimii move2().

Esimerkki 1. move2() johtaa tähän tuhoutumiseen:

 ←

yhden rivin Elementti vasemmalla puolella ei täsmää oikealla puolella, minkä vuoksi {x,y} täsmätään oletusarvoa vastaan eikä oikeanpuoleista dataa vastaan (säännöt 3b, 3D):

{x, y} ← { x: 0, y: 0 }

vasemmalla puolella on omaisuuden arvo pikakirjoitusta, se on lyhenne:

{x: x, y: y} ← { x: 0, y: 0 }

tämä destructuring johtaa seuraaviin kahteen toimeksiantoon (säännöt 2C, 1):

x = 0;y = 0;

Esimerkki 2. Tarkastellaan funktiokutsua move2({z:3}), joka johtaa seuraavaan destruktioon:

 ←

on Array Elementti indeksi 0 oikealla puolella. Siksi oletusarvo ohitetaan ja seuraava vaihe on (sääntö 3d):

{x, y} ← { z: 3 }

tämä johtaa siihen, että sekä x että y asetetaan arvoon undefined, mitä emme halua.

10. 11. 2. 3move1() #

yritetään move1().

Esimerkki 1: move1()

 ←

meillä ei ole Array Elementti indeksi 0 oikealla puolella ja käyttää oletusarvoa (sääntö 3d):

{x=0, y=0} ← {}

vasemmalla puolella on omaisuuden arvon pikakirjoitusta, mikä tarkoittaa, että tämä destructuring vastaa:

{x: x=0, y: y=0} ← {}

kummallakaan tontilla x eikä tontilla y ole osumaa oikealla puolella. Tämän vuoksi käytetään oletusarvoja ja suoritetaan seuraavat tuhot (sääntö 2D):

x ← 0y ← 0

tämä johtaa seuraaviin tehtäviin (sääntö 1):

x = 0y = 0

Esimerkki 2: move1({z:3})

 ←

Matriisikuvion ensimmäisellä elementillä on tulitikku oikealla puolella, ja tätä osumaa käytetään destruoinnin jatkamiseen (sääntö 3D):

{x=0, y=0} ← {z:3}

kuten esimerkissä 1, oikealla puolella ei ole ominaisuuksia x ja y ja käytetään oletusarvoja:

x = 0y = 0
10.11.2.4 johtopäätös #

esimerkit osoittavat, että oletusarvot ovat kuvion osien (objektin ominaisuudet tai Matriisielementit) ominaisuus. Jos osa ei täsmää tai se täsmää undefined kanssa, käytetään oletusarvoa. Eli kuvio on sovitettu vastaan oletusarvo, sen sijaan.