7 vinkkiä käsittelemään määrittelemätöntä JavaScriptiä

Suurimmalla osalla moderneista kielistä, kuten Ruby, Python tai Java, on yksi nolla-arvo (nil tai null), mikä vaikuttaa järkevältä.

Mutta JavaScript on erilainen.

null, mutta myös undefined, edustavat tyhjiä JavaScript-arvoja. Joten mikä on tarkka ero niiden välillä?

Lyhyt vastaus on, että JavaScript-tulkki palauttaa undefined, kun hän käyttää muuttujaa tai objektin ominaisuutta, jota ei ole vielä alustettu. Esimerkki:

Toisella puolella null edustaa puuttuvaa objektia viite. JavaScript ei alusta muuttujia tai objektin ominaisuuksia null -toiminnolla.

Jotkut alkuperäiset menetelmät, kuten String.prototype.match(), voivat palauttaa null merkitsemään puuttuvaa objektia. Katsokaa esimerkkiä:

Koska JavaScript on sallittu, kehittäjillä on houkutus käyttää alustamattomia arvoja. Olen myös syyllinen niin huonoon käytäntöön.

Tällaiset riskialttiit toiminnot aiheuttavat usein undefined liittyviä virheitä:

• TypeError: "undefined" is not a function
• TypeError: Cannot read property "<prop-name>" of undefined
• ja samankaltaiset virheet.

JavaScript-kehittäjä voi ymmärtää tämän vitsin ironian :

Tällaisten virheiden vähentämiseksi sinun on ymmärrettävä tapaukset, joissa undefined luodaan. Tutkitaan undefined ja sen vaikutusta kooditurvallisuuteen.

1. Mikä on määrittelemätöntä

JavaScriptillä on 6 primitiivistä tyyppiä:

Ja erotettu objektityyppi: {name: "Dmitri"} , .

6 primitiivisestä tyypistä undefined on erityisarvo, jolla on oma tyyppinsä Määrittelemätön. ECMAScript-määrityksen mukaan:

Määrittelemätöntä arvoprimitiivistä arvoa käytetään, kun muuttujalle ei ole määritetty arvoa.

Standardi määrittelee selvästi, että saat undefined, kun käytät alustamattomia muuttujia, ei-olemassa olevia objektin ominaisuuksia, ei-olemassa olevia taulukkoelementtejä ja vastaavia.

Muutama esimerkki:

Edellä oleva esimerkki osoittaa, että:

• alustamaton muuttuja number
• olematon objektiominaisuus movie.year
• tai ei-olemassa oleva taulukkoelementti movies

arvioidaan undefined.

ECMAScript-määrittely määrittelee undefined -arvotyypin:

Määrittelemätön tyyppi on tyyppi, jonka ainoa arvo on undefined -arvo.

Tässä mielessä typeof -operaattori palauttaa merkkijonon "undefined" undefined -arvolle:

Tietysti typeof toimii hienosti varmistaakseen, että muuttuja sisältää undefined -arvoa:

2. Skenaariot, jotka luovat määrittelemättömiä

2.1 Aloittamaton muuttuja

Ilmoitettu muuttuja, jota ei ole vielä määritetty arvoon (alustamaton), on oletusarvoisesti undefined.

Tavallinen ja yksinkertainen:

myVariable on ilmoitettu eikä sitä ole vielä määritetty arvoon. Muuttujan käyttö arvioi arvon undefined.

Tehokas tapa ratkaista alustamattomien muuttujien ongelmat on aina, kun mahdollista, antaa alkuarvo. Mitä vähemmän muuttujaa on alustamattomassa tilassa, sitä parempi.

Ihannetapauksessa määrität arvon heti ilmoituksen const myVariable = "Initial value" jälkeen. Mutta se ei ole aina mahdollista.

Vinkki 1: Suosikki const, muuten käytä let, mutta jätä hyvästit var

Mielestäni yksi ECMAScript 2015: n parhaista ominaisuuksista on uusi tapa ilmoittaa muuttujat käyttämällä const ja let. Se on iso askel eteenpäin.

const ja let estetään lohkossa (toisin kuin vanhemmat toiminnot, jotka on määritelty var) ja ovat ajallisessa kuolleessa vyöhykkeessä ilmoituksen riviin saakka.

Suosittelen muuttujaa const, kun sen arvo ei muutu. Se luo muuttumattoman sidoksen.

Yksi const -palvelun hienoista ominaisuuksista on, että sinun on määritettävä alkuarvo muuttujalle const myVariable = "initial". Muuttuja ei ole alttiina alustamattomalle tilalle, ja undefined -sovelluksen käyttö on mahdotonta.

Tarkistetaan toiminto, jolla varmistetaan, onko sana palindromi:

length ja half -muuttujille määritetään arvo kerran. Vaikuttaa järkevältä julistaa ne const, koska nämä muuttujat eivät muutu.

Käytä let -ilmoitusta muuttujille, joiden arvo voi muuttua. Määritä alkuarvo heti kun mahdollista, esim. let index = 0.

Entä vanha koulu var? Ehdotan, että lopetan sen käytön.

var ilmoitusongelma on muuttujan nostaminen funktion laajuudessa. Voit ilmoittaa var -muuttujan jossain toiminnon laajuuden lopussa, mutta silti pääset siihen ennen ilmoitusta: ja saat undefined.

myVariable on käytettävissä ja sisältää undefined jo ennen ilmoitusriviä: var myVariable = "Initial value".

Päinvastoin muuttujaa const tai let ei voida käyttää ennen ilmoitusriviä – muuttuja on ajallisesti kuolleella alueella ennen ilmoitusta. Ja se on mukavaa, koska sinulla on vähemmän mahdollisuuksia käyttää undefined.

Yllä oleva esimerkki päivitettiin nimellä let (sen sijaan var) heittää ReferenceError, koska ajallisen kuolleen vyöhykkeen muuttuja ei ole käytettävissä.

muuttuja.

Vinkki 2: Lisää koheesiota

Koheesio kuvaa sitä, missä määrin moduulin elementit (nimitila, luokka, menetelmä, koodilohko) kuuluvat yhteen. Koheesio voi olla korkea tai matala.

Korkean koheesion moduuli on suositeltava, koska tällaisen moduulin elementit keskittyvät vain yhteen tehtävään. Se tekee moduulista:

• Kohdennettu ja ymmärrettävä: helpompi ymmärtää, mitä moduuli tekee
• Ylläpidettävä ja helpompi muokata: moduulin muutos vaikuttaa vähemmän moduuleihin
• Uudelleenkäytettävä: keskittyminen yhteen tehtävään helpottaa moduulin uudelleenkäyttöä.
• Testattavissa: helpommin testaat moduulin, joka on keskittynyt yhteen tehtävään. p>

  Suuri koheesio, johon liittyy löysä kytkentä, on hyvin suunnitellun järjestelmän ominaisuus.

  Koodilohkoa voidaan pitää pienenä moduulina. Voit hyötyä korkean yhteenkuuluvuuden eduista pitämällä muuttujat mahdollisimman lähellä niitä käyttävää koodilohkoa.

  Jos esimerkiksi muuttuja on olemassa vain lohkon laajuuden logiikan muodostamiseksi, julista ja tee muuttuja elossa vain kyseisen lohkon sisällä (käyttämällä const tai let -ilmoitukset). Älä altista tätä muuttujaa ulkoisen lohkon laajuudelle, koska ulomman lohkon ei pitäisi välittää tästä muuttujasta.

  Yksi klassinen esimerkki tarpeettomasti pidennetystä muuttujien elämästä on for sykli toiminnon sisällä:

  index, item ja length muuttujat ilmoitetaan funktion rungon alussa. Niitä käytetään kuitenkin vasta loppupuolella. Mikä on tämän lähestymistavan ongelma?

  Yläosassa olevan ilmoituksen ja for -lausekkeen käytön välillä muuttujat index, item ei ole alustettu ja altistettu undefined -palvelulle. Niiden elinkaari on kohtuuttoman pitkä koko toiminnossa.

  Parempi lähestymistapa on siirtää nämä muuttujat mahdollisimman lähelle niiden käyttöpaikkaa:

  index ja item -muuttujia on vain lauseen for lause lohkossa. Niillä ei ole merkitystä for -alueen ulkopuolella.
  length -muuttuja ilmoitetaan myös sen käytön lähteen läheisyydessä.

  Miksi muokattu versio on parempi kuin alkuperäinen? Katsotaanpa:

  • Muuttujat eivät ole alttiina alustamattomalle tilalle, joten sinulla ei ole riskiä käyttää undefined
  • muuttujat mahdollisimman lähellä niiden käyttöpaikkaa lisäävät koodin luettavuutta
  • Suuret yhtenäiset koodipalat on helpompi muokata ja purkaa tarvittaessa erillisiin toimintoihin

  2.2 Pääsy olematon ominaisuus

  Kun yrität käyttää ei-olemassa olevaa objektin ominaisuutta, JavaScript palauttaa undefined.

  Osoitetaan, että esimerkissä:

  favoriteMovie on objekti, jolla on yksi ominaisuus title. Olemassa olevan ominaisuuden actors käyttäminen ominaisuuskäyttäjän avulla favoriteMovie.actors arvioi arvon undefined.

  Olemassa olevan ominaisuuden käyttö ei aiheuta virhettä. Ongelma ilmenee, kun yritetään saada tietoja olemattomasta ominaisuudesta, joka on yleisin undefined -loukku, joka näkyy tunnetussa virheilmoituksessa TypeError: Cannot read property <prop> of undefined.

  Muutetaan edellistä koodinpätkää hieman TypeError -heiton havainnollistamiseksi:

  favoriteMovie ei ole ominaisuutta actors, joten favoriteMovie.actors arvioi undefined.

  Tämän seurauksena undefined -arvon ensimmäisen kohteen käyttö lausekkeella favoriteMovie.actors heittää TypeError.

  JavaScriptin sallivuus, joka sallii pääsyn olemattomiin ominaisuuksiin, on epädeterminismin lähde: ominaisuus voidaan asettaa tai ei. Hyvä tapa ohittaa tämä ongelma on rajoittaa objekti siten, että se on aina määrittänyt sillä olevat ominaisuudet.

  Valitettavasti et usein hallitse objekteja. Tällaisilla kohteilla voi olla erilaiset ominaisuudet erilaisissa tilanteissa. Joten sinun on käsiteltävä kaikki nämä skenaariot manuaalisesti.

  Toteutetaan toiminto append(array, toAppend), joka lisää uusien elementtien joukon alkuun ja / tai loppuun. toAppend -parametri hyväksyy objektin, jolla on ominaisuuksia:

  • first: elementti lisätään array
  • last: elementti lisätty array.

  Funktio palauttaa uuden taulukon esiintymän muuttamatta alkuperäistä taulukkoa.

  append(): n ensimmäinen, hieman naiivi, versio voi näyttää tältä:

  Koska toAppend -objekti voi jättää first – tai last -ominaisuudet pois, on pakollinen tarkistaa, onko näitä ominaisuuksia olemassa toAppend.

  Sivuston käyttöoikeudet arvioi arvoksi undefined, jos ominaisuutta ei ole. Ensimmäinen kiusaus tarkistaa, onko first vai last ominaisuuksia olemassa, on tarkistaa ne undefined. Tämä suoritetaan ehdollisissa ehdoissa if(toAppend.first){} ja if(toAppend.last){}…

  Ei niin nopeasti. Tällä lähestymistavalla on haittapuoli. undefined sekä false, null, 0, NaN ja "" ovat väärät arvot.

  append(): n nykyisessä toteutuksessa toiminto ei salli väärennettyjen elementtien lisäämistä:

  Seuraavissa vihjeissä selitetään, kuinka kiinteistön olemassaolo voidaan tarkistaa oikein.

  Vihje 3: Tarkista kiinteistön olemassaolo

  Onneksi JavaScript tarjoaa joukko tapoja selvittää, onko objektilla tietty ominaisuus:

  • obj.prop !== undefined: vertaa undefined suoraan
  • typeof obj.prop !== "undefined": vahvista ominaisuuden arvon tyyppi
  • obj.hasOwnProperty("prop"): tarkista, objektilla on oma ominaisuus
  • "prop" in obj: tarkista onko objektilla oma vai peritty ominaisuus

  Suosittelen käytä in -operaattoria. Sillä on lyhyt ja suloinen syntakse. in -operaattorin läsnäolo viittaa selkeään tarkoitukseen tarkistaa, onko objektilla tietty ominaisuus, pääsemättä käyttämättä todellista ominaisuusarvoa.

  

  obj.hasOwnProperty("prop") on myös hieno ratkaisu. Se on hieman pidempi kuin in -operaattori ja tarkistaa vain kohteen omissa ominaisuuksissa.

  Parannetaan append(array, toAppend) -funktiota käyttämällä in -operaattoria:

  "first" in toAppend (ja "last" in toAppend) on true onko vastaava ominaisuus olemassa, false muuten.

  in -operaattori korjaa väärennettyjen elementtien 0 ja false. Nyt näiden elementtien lisääminen -kohdan alkuun ja loppuun tuottaa odotetun tuloksen .

  Vinkki 4: Uudelleenjärjestely objektin ominaisuuksien käyttämiseksi

  Kun käytät objekti-ominaisuutta, joskus on tarpeen asettaa oletusarvo, jos ominaisuutta ei ole.

  Voit käyttää in -tapaa kolminkertaisen operaattorin kanssa tämän saavuttamiseksi:

  Kolmen operaattorin syntaksista tulee pelottava, kun tarkistettavien ominaisuuksien määrä kasvaa. Jokaiselle ominaisuudelle sinun on luotava uusi koodirivi oletusarvojen käsittelemiseksi, mikä lisää samanlaisen näköisten kolmion operaattoreiden rumaa seinää.

  Jos haluat käyttää tyylikkäämpää lähestymistapaa, tutustu upeaan ES2015-ominaisuuteen, jota kutsutaan kohteen tuhoamiseksi.

  Kohteen tuhoaminen mahdollistaa objektin ominaisuusarvojen sisäisen purkamisen suoraan muuttujiin ja oletusarvon asettamisen, jos ominaisuutta ei ole olemassa. Kätevä syntaksin välttämiseksi käsittelemään suoraan undefined.

  Ominaisuuden poiminta on todellakin nyt tarkka:

  Jos haluat nähdä asiat toiminnassa, määritellään hyödyllinen funktio, joka kietoo merkkijonon lainausmerkkeihin.

  quote(subject, config) hyväksyy ensimmäisen argumentin pakattavaksi merkkijonoksi. Toinen argumentti config on objekti, jolla on ominaisuudet:

  Kohteen tuhoamisen edut soveltamalla toteutetaan quote():

  const { char = """, skipIfQuoted = true } = config uudelleenjärjestelymääritys yhdellä rivillä poimii ominaisuudet char ja skipIfQuoted kohteesta config -objekti.
  Jos joitain ominaisuuksia puuttuu objektista config, tuhoamisominaisuus määrittää oletusarvot : """ kohteelle char ja false kohteelle skipIfQuoted.

  Onneksi toiminnossa on vielä parantamisen varaa.

  Siirretään destruktion määritys parametrit-osioon. Ja aseta parametrille config oletusarvo (tyhjä objekti { }) ohittaaksesi toisen argumentin, kun oletusasetukset ovat riittävät.

  Tyhjentävä määritys korvaa parametrin config funktion allekirjoituksessa. Pidän siitä: quote() muuttuu yhdellä rivillä lyhyempi.

  = {} tuhoamismäärityksen oikealla puolella varmistaa, että tyhjää objektia käytetään, jos toista argumenttia ei ole määritelty lainkaan quote("Sunny day").

  Kohteen tuhoaminen on tehokas ominaisuus, joka hoitaa tehokkaasti ominaisuuksien poiminnan esineistä. Pidän mahdollisuudesta määrittää palautettava oletusarvo, kun käytettyä ominaisuutta ei ole. Tämän seurauksena vältät undefined ja sen ympärillä olevaa hässäkkää.

  Vinkki 5: Täytä objekti oletusominaisuuksilla

  Jos jokaiselle ominaisuudelle ei tarvitse luoda muuttujia, kuten uudelleenjärjestelymääritys tekee, osa ominaisuuksista puuttuva objekti voidaan täyttää oletusarvoilla.

  ES2015 Object.assign(target, source1, source2, ...) kopioi kaikkien lukemattomien omien ominaisuuksien arvot yhdestä tai useammasta lähdeobjektista kohdeobjektiin. Funktio palauttaa kohdeobjektin.

  Sinun on esimerkiksi käytettävä unsafeOptions -objektin ominaisuuksia, jotka eivät aina sisällä kaikkia sen ominaisuuksia.

  Jotta vältetään undefined, kun yritetään käyttää ei-ominaisuutta osoitteesta unsafeOptions, tehdään joitain muutoksia:

  • Määritä objekti defaults, jolla on oletusominaisuudet.
  • Kutsu Object.assign({ }, defaults, unsafeOptions) rakentamaan uusi objekti options. Uusi objekti vastaanottaa kaikki ominaisuudet kohteesta unsafeOptions, mutta puuttuvat kohteet otetaan kohteesta defaults.

  unsafeOptions sisältää vain ominaisuuden fontSize. defaults -objekti määrittää oletusarvot ominaisuuksille fontSize ja color.

  Object.assign() ottaa ensimmäisen argumentin kohdeobjektiksi {}. Kohdeobjekti vastaanottaa fontSize -omaisuuden arvon lähdeobjektilta unsafeOptions. Ja color -ominaisuuden arvo lähdeobjektista defaults, koska unsafeOptions ei sisällä color.

  Lähdeobjektien luettelointijärjestyksellä on merkitystä: myöhemmät lähdeobjektiominaisuudet korvaavat aikaisemmat.

  Voit nyt käyttää kaikkia options -objektin ominaisuuksia, mukaan lukien options.color, joka ei ollut käytettävissä ryhmässä unsafeOptions aluksi.

  Onneksi on olemassa helpompi vaihtoehto objektin täyttämiseksi oletusominaisuuksilla.Suosittelen leviämisominaisuuksien käyttämistä objektin alustusohjelmissa.

  Object.assign() -kutsujen sijasta kopioi kohdeobjektiin kaikki objektin levityssyntaksilla kaikki omat ja lueteltavat ominaisuudet lähde-objekteista: objektin alustusohjelma levittää ominaisuuksia defaults – ja unsafeOptions -lähde-objekteista. Lähdeobjektien määritysjärjestys on tärkeä: myöhemmät lähdeobjektiominaisuudet korvaavat aikaisemmat.

  Keskeneräisen objektin täyttäminen oletusarvoisilla ominaisuusarvoilla on tehokas strategia tehdä koodistasi turvallinen ja kestävä. Tilanteesta riippumatta, objekti sisältää aina kaikki ominaisuudet: undefined ei voida luoda.

  Bonusvinkki: nolla yhdistäminen

  Operaattori nolla yhdistäminen arvioi oletusarvon, kun sen operandi on undefined tai null:

  Nullan yhdistämisen operaattorilla on helppo käyttää objektiominaisuutta samalla kun sillä on oletusarvo, kun tämä ominaisuus on undefined tai null:

  styles objektilla ei ole ominaisuutta color, joten styles.color ominaisuuden käyttöoikeus on undefined. styles.color ?? "black" arvioi oletusarvoksi "black".

  styles.fontSize on 18, joten tyhjä yhdistynyt operaattori arvioi ominaisuuden arvoksi 18.

  2.3 Toimintoparametrit

  Funktion parametrit ovat implisiittisesti oletusarvoisesti undefined.

  Yleensä tiettyyn parametrimäärällä määritetty funktio tulisi kutsua samalla argumenttimäärällä. Silloin parametrit saavat odotetut arvot:

  Kun multiply(5, 3), parametrit a ja b saavat 5 ja 3 arvot. Kertolasku lasketaan odotetulla tavalla: 5 * 3 = 15.

  Mitä tapahtuu, kun jätät argumentin pois kutsusta? Vastaavasta parametrista funktion sisällä tulee undefined.

  Muutetaan hieman edellistä esimerkkiä kutsumalla funktio vain yhdellä argumentilla:

  Kutsu multiply(5) suoritetaan yhdellä argumentilla: tulos a -parametri on 5, mutta b -parametri on undefined.

  Vinkki 6: Käytä parametrin oletusarvoa.

  Joskus funktio ei vaadi kaikkia argumentteja joukossa. Voit asettaa oletusarvot parametreille, joilla ei ole arvoa.

  Palataksemme edelliseen esimerkkiin, tehkäämme parannus. Jos b -parametri on undefined, anna sen oletusarvoisesti 2:

  Funktio kutsutaan yhdellä argumentilla multiply(5). Aluksi a -parametri on 2 ja b on undefined.
  Ehdollinen käsky tarkistaa, onko b undefined. Jos näin tapahtuu, b = 2 -määritys asettaa oletusarvon.

  Vaikka annettu oletusarvojen osoittamistapa toimii, en suosittele vertailua suoraan undefined -versioon. Se on monipuolinen ja näyttää hakkeroinnilta.

  Parempi lähestymistapa on käyttää ES2015-oletusparametrien ominaisuutta. Se on lyhyt, ilmaiseva eikä sisällä suoria vertailuja undefined: iin.

  Oletusarvon lisääminen parametriin b = 2 näyttää paremmalta:

  b = 2 funktion allekirjoituksessa varmistaa, että jos b on undefined, parametrin oletusarvo on 2.

  ES2015-oletusparametrien ominaisuus on intuitiivinen ja ilmeikäs. Käytä sitä aina oletusarvojen asettamiseen valinnaisille parametreille.

  2.4 Funktion palautusarvo

  Epäsuorasti, ilman lauseketta return, JavaScript-funktio palauttaa undefined.

  Toiminto, jolla ei ole return -lauseke palauttaa implisiittisesti undefined:

  square() -funktio ei palauta laskentatuloksia. Funktion kutsutulos on undefined.

  Sama tilanne tapahtuu, kun return -lauseke on läsnä, mutta ilman lähistöllä olevaa lauseketta:

  return; -lauseke suoritetaan, mutta se ei palauta lauseketta. Kutsutulos on myös undefined.

  Tietenkin ilmaiseminen lähellä return palautettava lauseke toimii odotetulla tavalla:

  Nyt funktion kutsuksi arvioidaan 4, joka on 2 neliö.

  Vihje 7: Älä luota automaattiseen puolipisteen lisäykseen.

  Seuraavan JavaScript-lauseiden luettelon on lopputtava puolipisteillä (;) :

  • tyhjä lause
  • let, const, var, import, export -ilmoitukset
  • lauseke
  • debugger lause
  • continue lause, break lause
  • throw -lauseke
  • return -lauseke

  Jos käytät yhtä yllä olevista lauseista, muista ilmoittaa puolipiste lopussa:

  Molempien lopussa let -ilmoitus ja return -lauseke pakollinen puolipiste kirjoitetaan.

  Mitä tapahtuu, kun et halua ilmoittaa näitä puolipisteet? Tällaisessa tilanteessa ECMAScript tarjoaa automaattisen puolipisteiden lisäysmekanismin (ASI), joka lisää sinulle puuttuvat puolipisteet.

  ASI: n avulla voit poistaa puolipisteet edellisestä esimerkistä:

  Yllä oleva teksti on kelvollinen JavaScript-koodi. Puuttuvat puolipisteet lisätään automaattisesti sinulle.

  Ensi silmäyksellä se näyttää melko lupaavalta. ASI-mekanismin avulla voit ohittaa tarpeettomat puolipisteet. Voit tehdä JavaScript-koodista pienemmän ja helpommin luettavan.

  ASI on luonut yhden pienen, mutta ärsyttävän ansan. Kun uusi viiva on return ja palautetun lausekkeen return \n expression välissä, ASI lisää puolipisteen automaattisesti uuden rivin return; \n expression.

  Mitä funktion sisällä tarkoittaa return; -lausekkeen merkitseminen? Funktio palauttaa undefined. Jos et tiedä yksityiskohtaisesti ASI: n mekanismia, odottamaton palautettu undefined on harhaanjohtava.

  Tutkitaan esimerkiksi getPrimeNumbers() -kutsun palautettua arvoa:

  return -lausekkeen ja taulukon kirjaimellisen lausekkeen välissä on uusi rivi. JavaScript lisää puolipisteen automaattisesti return jälkeen ja tulkitsee koodin seuraavasti:

  Lauseke return; saa funktion getPrimeNumbers() palauttamaan undefined odotetun taulukon sijasta.

  Ongelma ratkaistaan poistamalla uusi rivi return ja taulukon literaali välillä:

  Suosittelen tutkimaan, kuinka automaattinen puolipisteen lisäys toimii tällaisten tilanteiden välttämiseksi.

  Älä tietenkään aseta uutta riviä return ja palautetun lausekkeen väliin.

  2.5 void -operaattori

  void <expression> arvioi lausekkeen ja palauttaa undefined tuloksesta riippumatta arvioinnin.

  Operaattorin void yksi käyttötapaus on estää lausekkeen arviointi arvoon undefined vedoten arvioinnin joihinkin sivuvaikutuksiin.

  3. undefined taulukoissa

  Saat undefined, kun käytät matriisielementtiä, jonka hakemisto on rajojen ulkopuolella.

  colors taulukossa on 3 elementtiä, joten kelvolliset hakemistot ovat 0, 1 ja 2.

  Koska hakemistoissa 5 ja -1 ei ole taulukkoelementtejä, käyttöoikeudet colors ja colors ovat undefined.

  JavaScriptissä saatat kohdata niin sanottuja harvoja taulukoita. Opinnäytteet ovat taulukoita, joissa on aukkoja, ts. Joissakin hakemistoissa ei ole määritelty elementtejä.

  Kun harvan taulukon sisällä on aukko (alias tyhjä paikka), saat myös undefined.

  Seuraava esimerkki luo harvoja taulukoita ja yrittää käyttää niiden tyhjiä paikkoja:

  sparse1 luodaan kutsumalla Array konstruktori, jonka ensimmäinen argumentti on numeerinen.Siinä on 3 tyhjää paikkaa.

  sparse2 luodaan taulukon kirjaimella, josta puuttuu toinen elementti.

  Missä tahansa näistä harvoista matriiseista tyhjän paikan käyttö arvioi undefined.

  Kun työskentelet matriisien kanssa, välttää undefined, muista käyttää kelvollisia taulukkoindeksejä ja estää harvojen matriisien luominen.

  4. Määrittelemättömän ja tyhjän välinen ero

  Mikä on tärkein ero undefined ja null? Molemmat erityisarvot tarkoittavat tyhjää tilaa.

  undefined edustaa muuttujan arvoa, jota ei ole vielä alustettu, kun taas null edustaa tarkoituksellista kohteen puuttumista.

  Tutkitaan eräiden esimerkkien eroa.

  Muuttuja number on määritelty ei kuitenkaan määritetä alkuarvoon:

  number muuttuja on undefined, mikä osoittaa alustamattoman muuttujan.

  Sama alustamaton käsite tapahtuu, kun ei-olemassa olevaa objektin ominaisuutta käytetään:

  Koska lastName -ominaisuutta ei ole kohdassa obj, JavaScript arvioi obj.lastName arvoksi undefined.

  Toisella puolella tiedät, että muuttuja odottaa objektia. Mutta jostain syystä et voi instantisoida kohdetta. Tällöin null on puuttuvan objektin merkityksellinen indikaattori.

  Esimerkiksi clone() on funktio, joka kloonaa tavallisen JavaScript-objektin. Funktion odotetaan palauttavan objektin:

  Kuitenkin clone() voidaan kutsua ei-objekti-argumentilla: 15 tai null. Tällöin funktio ei voi luoda kloonia, joten se palauttaa puuttuvan objektin ilmaisimen null.

  typeof -operaattori erottaa undefined ja null:

  Myös tiukka laatuoperaattori === erottaa lähettäjältä null:

  5. Päätelmä

  undefined olemassaolo on seurausta JavaScriptin sallivasta luonteesta, joka sallii seuraavien käyttämisen:

  • alustamattomat muuttujat
  • olemattomat objektiominaisuudet tai -menetelmät
  • rajat ylittävistä hakemistoista, joilla pääset matriisielementteihin
  • mitään funktiota, joka ei palauta mitään, kutsutun tuloksen

  Vertailu suoraan kohtaan undefined on vaarallista, koska luotat edellä mainittuun sallittuun mutta lannistettuun käytäntöön.

  Tehokas strategia on vähentää undefined -avainsanan ulkonäköä koodissasi soveltamalla hyviä tapoja, kuten:

  • vähennä alustamattomien muuttujien käyttöä
  • tehdä muuttujista elinkaari lyhyt ja lähellä niiden lähdettä
  • aina kun mahdollista antaa alkuperäiset arvot muuttujille
  • suosivat const, muuten käytä let
  • käytä oletusarvoja merkityksettömiin toimintoparametreihin
  • vahvista ominaisuudet olemassaolo tai täytä vaaralliset objektit oletusominaisuuksilla
  • vältä harvojen taulukoiden käyttöä

  Onko hyvä, että Javascriptissa on molemmat undefined ja null edustamaan tyhjiä arvoja?