Objekti JavaScript v primerih

12. 3. 2019

Predmeti so temelj javascripta. Številni vgrajeni podatkovni tipi so predstavljeni kot objekti. Če želite biti uspešen razvijalec JavaScripta, morate imeti jasno predstavo o tem, kako delujejo. Gradbeni elementi objekta se imenujejo njegova polja ali lastnosti predmeta JavaScript. Uporabljajo se za opis katerega koli vidika predmeta. Lastnost lahko opiše dolžino seznama, barvo neba ali datum rojstva osebe. Ustvarjanje objektov je preprost postopek. Jezik ponuja sintakso, znano kot objektni literali, ki so označeni z zavitimi oklepaji.

Dostop do lastnosti

Jezik ponuja dva vnosa za dostop do lastnosti. Prvi in ​​najpogostejši je znan kot pika notacija. V pikčastih zapisih lahko dostop do vira dobimo tako, da podamo ime gostiteljskega objekta, ki mu sledi obdobje in ime lastnosti. Na primer, ko je bila object.foo prvotno dodeljena vrednost ena, potem bo njena vrednost postala 2 po izvršitvi JavaScript operaterja objektov.

Nadomestna sintaksa za dostop je znana kot oklepaji. V zapisu sledi ime predmeta v obliki oglatih oklepajev. V njih je ime lastnosti podano kot niz:

object ["foo"] = objekt ["foo"] + 1.

Je izrazitejša od zapisov točk, ker omogoča spremenljivki, da navede vse ali del imena lastnosti. To je mogoče, ker interpreter objektov JavaScript ta izraz samodejno pretvori v niz in nato dobi ustrezno lastnost. Imena lastnosti so ustvarjena na letalu z združevanjem vsebine spremenljivke f z nizom "oo":

var f = "f";

predmet [f + "oo"] = "vrstica".

Označevanje oklepa omogoča, da imena lastnosti vsebujejo znake, ki niso dovoljeni v pikčastih zapisih. Naslednja izjava je na primer popolnoma zakonita v oklepajih. Če pa uporabnik poskuša ustvariti isto ime lastnosti v pikčastih zapisih, bo naletel na sintaktično napako:

object ["! @ # $% & * ()."] = true.

Dostop do lastnosti ugnezdenih objektov JavaScript je mogoče dobiti s povezovanjem točk in / ali oklepajev. Na primer, naslednji objekt vsebuje vdelani objekt z imenom baz, ki vsebuje drug objekt z imenom foo, ki ima lastnost, imenovano vrstica, ki vsebuje vrednost pet:

var objekt = {baz: {foo: {bar: 5}}}.

Naslednji izrazi dostopajo do lastnine priključenega gumba. Prvi izraz uporablja zapis pika, drugi izraz pa kvadratni zapis. Tretji izraz združuje oba vnosa za dosego istega rezultata:

  • object.baz.foo.bar;
  • object ["baz"] ["foo"] ["bar"];
  • object ["baz"]. foo ["bar"].

Izrazi, kot so prikazani v prejšnjem primeru, lahko povzročijo slabo delovanje, če se nepravilno uporabljajo in onemogočijo predmet JavaScript. Za ovrednotenje vsake točke ali izraza v oklepajih je potreben čas. Če se isto lastnost uporablja večkrat, je smiselno enkrat dostopiti do lastnosti in nato shraniti vrednost v lokalno spremenljivko za vse prihodnje namene.

Funkcija kot metoda

Če se funkcija uporablja kot lastnost objekta, se imenuje metoda. Podobno kot lastnosti so podane v literarnem zapisu objekta. Na primer:

var objekt = {sum: funkcija (foo, bar) {vrnitev foo + bar; }}.

Objektne metode JavaScript lahko prikličete z uporabo oznak in oklepajev. Naslednji primer kliče metodo sum () iz prejšnjega primera z uporabo obeh vnosov:

  • object.sum (1, 2);
  • predmet ["sum"] (1, 2).

Poimenovanje objektnega literala je uporabno za ustvarjanje novih objektov, vendar ne more dodajati lastnosti ali metod obstoječim. Na srečo je dodajanje novih podatkov tako enostavno kot ustvarjanje izjave o dodelitvi. Ustvari se prazen predmet. Nato z uporabo operaterjev dodajanja dodamo dve lastnosti, foo in bar, tudi metodo baz:

  • var object = {};
  • object.foo = 1;
  • object.bar = null;
  • object.baz = function () {return "hello from baz ()"; }.

Programska enkapsulacija

Glavna ideja objektno usmerjenega programiranja je, da program razdelimo na manjše dele in naredimo vsakega odgovornega za upravljanje svoje lastne države. Tako je lahko nekaj znanja o tem, kako del programa deluje, lokalno za ta del. Nekdo, ki dela na preostalem programu, se tega ne bi smel spomniti ali ga celo vedeti. Kadarkoli se ta lokalni podatki spremenijo, je treba posodobiti samo kodo, ki je neposredno okoli nje.

Različni deli takšnega programa med seboj komunicirajo prek vmesnikov, omejenih nizov funkcij ali povezav, ki zagotavljajo uporabno funkcionalnost na bolj abstraktni ravni in skrivajo njihovo natančno izvajanje. Taki deli programa so modelirani z uporabo objektov. Njihov vmesnik je sestavljen iz določenega nabora metod in lastnosti. Lastnosti, ki so del vmesnika, se imenujejo javne. Ostalo, ki se ne sme dotikati zunanje kode, se imenuje zasebno.

Mnogi jeziki omogočajo razlikovanje med javnimi in zasebnimi lastnostmi in ne dovoljujejo zunanjega dostopa do zasebnih. JavaScript, ki je zopet minimalističen, še ni dosežen. Trenutno poteka delo za dodajanje tega jezika. Zato bodo programerji JavaScripta to idejo uspešno uporabili. Dostopni vmesnik je praviloma opisan v dokumentaciji ali komentarjih. Prav tako je običajno, da podčrtaj (_) na začetku imen lastnosti označuje, da so te lastnosti zasebne. Ločevanje vmesnika od izvajanja je odlična ideja. Ponavadi se imenuje enkapsulacija.

Lastnosti

Lastnosti predmeta

Objekt z oklepaji {...} se imenuje objektni literal. Nekatere lastnosti lahko takoj vnesete v oklepaje {...}. Na primer, pari »ključ: vrednost in tako naprej«:

naj uporabnik = {// ime objekta: "John", // s ključem "name" shrani vrednost "John" starost: 30 // po ključu "starost" shrani vrednost 30}.

Lastnost ima ključ (imenovan tudi "ime" ali "identifikator") pred dvopičjem ":" in vrednost na desni. Obstajata dve lastnosti v uporabniškem objektu. Nastali predmet JavaScript uporabnika z dvema podpisanima datotekama z besedama »ime« in »starost«. Datoteke lahko kadar koli dodate, izbrišete in preberete. Vrednosti lastnosti so na voljo z zapisom pik. Lahko je katere koli vrste. Dodate lahko logično vrednost. Če želite izbrisati lastnost, uporabite delete v primeru predmeta JavaScript JavaScript.

Vsi objekti napake JavaScript so potomci objekta Error ali podedovani objekt:

  1. Objekt sintaktične napake je podedovan iz objekta Error.
  2. JSON Analiza napake določene vrste sintakse objekta Error.

Da bi še bolj razumeli, kako se aplikacije ukvarjajo z napakami JavaScripta, je bolje, da se seznanite z Airbrake JavaScriptom - orodjem za sledenje napakam za opozorila v realnem času in takojšnje razumevanje, kaj je šlo narobe s kodo JavaScript.

Sporočila o napakah, ki jih uporabnik lahko prejme, preden odstrani predmet JavaScript:

  1. Napačen kontrolni znak v literalnem nizu.
  2. Slab znak v literalnem nizu.
  3. Napačen izhod Unicode.
  4. Slab znak za pobeg.
  5. Neprekinjeni niz.
  6. Nepričakovana nenumerična koda.
  7. Manjkajoče številke za decimalno vejico.
  8. Neprekinjeno delno število.
  9. Po indikatorju stopnje ni številk.
  10. Številke po znaku eksponenta manjkajo.
  11. Eksponentni del nima številke.
  12. Nepričakovan konec podatkov.
  13. Nepričakovana ključna beseda.
  14. Nepričakovan znak.
  15. Konec podatkov pri branju vsebine predmeta.
  16. Pričakovano ime lastnosti ali '}'.

Računalniške lastnosti

V literaturi objekta lahko uporabite kvadratne oklepaje. To se imenuje izračunane lastnosti. Primer je podan spodaj.

Vrednost izračunljivega premoženja je preprosta: [sadje] pomeni, da mora biti ime premoženja vzeto iz sadja. Torej, če obiskovalec vstopi v "jabolko", bo vreča postala {apple: 5}. Zapletenejše izraze lahko uporabite v oglatih oklepajih:

naj sadje = „jabolko“;

pusti vrečko = {

[fruit + 'Computers']: 5 // bag.appleComputers = 5

};

Oklepaji so veliko močnejši od točkastih simbolov. Omogočajo imena in spremenljivke lastnosti. Toda pisanje je tudi težje. Zato je večina časa, ko so imena nepremičnin znana in preprosta, uporabljena pika. In če potrebujete nekaj bolj zapletenega, potem preklopite na kvadratne oklepaje.

Besedne rezervacije

Spremenljivka ne more imeti imena, ki je enako eni od rezerviranih besed, kot sta "za", "pusti", "vrni" itd. Toda pri razvrščanju predmetov JavaScripta ni omejitev.

Besedne rezervacije

Načeloma je vsako ime dovoljeno, vendar obstaja nekaj posebnega: "__proto__" prejme posebno pritožbo zaradi zgodovinskih razlogov. Na primer, ne morete ga nastaviti za vrednost, ki ni predmet:

let obj = {};

obj .__ proto__ = 5;

opozorilo (obj .__ proto__); // [objekt Object], ni deloval, kot je bilo predvideno

Kot je razvidno iz kode, se dodelitev primitivnega 5 ne upošteva. To je lahko vir napak in celo ranljivosti, če operater namerava v objekt shraniti poljubne pare ključ / vrednost in dovoliti obiskovalcu, da določi ključe. V tem primeru lahko obiskovalec izbere »proto« kot ključ in doda JavaScript v objekt. Obstaja način, da objekte, ki jih obdeluje __proto__, naredite kot navadno lastnost. Obstaja tudi druga podatkovna struktura, ki podpira poljubne ključe.

Celotne lastnosti

Izraz »celoštevilčna lastnost« tukaj pomeni niz, ki ga je mogoče pretvoriti iz celote brez spreminjanja. Tako je, na primer, »49« ime lastnosti celih števil, ker je, ko se pretvori v celo število in nazaj, še vedno isto. Toda "+49" in "1.2" nista. Po drugi strani, če ključi niso celo število, so navedeni v vrstnem redu ustvarjanja. Primer spodaj.

Celotne lastnosti

Če želite odpraviti težavo s pomočjo telefonskih kod, lahko "goljufirate" tako, da kode ne celo število. Dodajanje "+" (znak plus) pred vsako kodo zadostuje. Sedaj bo deloval, kot je bilo predvideno.

Razlika med predmeti in primitivi je v tem, da so shranjeni in kopirani »z referenco«. Primitivne vrednosti so dodeljene in kopirane “kot celo število”. Spremenljivka shrani »naslov v spomin«, ne pa samega objekta ali »povezave« z njim. Vsako spremenljivko lahko uporabite za dostop in spremembo njene vsebine.

Uporabi spremenljivko

Zgornji primer kaže, da ga lahko vnese samo en objekt in skrbnik. Če se pozneje uporabi drug ključ (uporabnik), bo uporabnik zaznal spremembe.

Operaterji enakosti == in stroga enakost === delujejo za objekte na enak način. Dva predmeta sta enaka samo, če sta isti predmet. Za primerjave, kot so obj1> obj2 ali za primerjavo s primitivnim obj == 5, se objekti pretvorijo v primitive. Če sem iskren, so take primerjave zelo redko potrebne in so običajno posledica napake pri kodiranju.

Preverjanje JavaScript objektov

Objekti imajo dostop do vseh lastnosti. Če pa sploh ne obstaja, to ne bo napaka. Neodvisno se vrne samo dostop do neobstoječega lastnosti. Zagotavlja zelo pogost način testiranja lastnosti in ga primerja z nedefinirano. Spodaj je primer.

Preverjanje JavaScript objektov

Za lastnosti, ki so shranjene nedefinirane, uporabite »in«. Običajno stroga "=== undefined" preverjanje primerjave deluje v redu. Obstaja poseben primer, ko ne uspe in "in" deluje pravilno. To se zgodi, ko lastnost objekta obstaja, vendar shrani neopredeljeno.

lastnina obj.test

V zgornji kodi lastnost obj.test tehnično obstaja. Zato operater deluje pravilno. Takšne situacije se zgodi zelo redko, saj običajno niso dodeljene nedefinirane. Uporabljajo se večinoma ničelne "neznane" ali "prazne" vrednosti. Tako je v izjavi dejansko gost v kodi.

"Za .. v" ciklu

Za krmarjenje skozi vse tipke od objekta do objekta obstaja posebna oblika zanke: za .. v. To je popolnoma drugačna stvar od konstrukcije za (;;).

Spodaj je primer.

"Za .. v" ciklu

Opozoriti je treba, da vse za konstruktorje dovoljujejo razglasitev zanke spremenljivk znotraj zanke kot tipka pusti. Namesto tega lahko uporabite drugo ime spremenljivke ključa.

Na primer, za (let prop v obj) se prav tako pogosto uporablja.

Obstaja alternativna »kvadratna oklepaja«, ki deluje z vsakim nizom.

Kvadratna oklepaja

V tem primeru pika zahteva, da so ključi objekta JavaScript veljavni identifikator spremenljivke, kar pomeni, da ni presledkov in drugih omejitev. Paziti je treba, da je vrv znotraj nosilcev pravilno navedena. Oklepaji zagotavljajo tudi način, kako dobiti ime lastnosti kot rezultat kateregakoli izraza, v nasprotju z literarnim nizom, iz spremenljivke:

pusti ključ = "všeč ptice";

// enako kot uporabnik ["likes birds"] = true;

uporabnik [tipka] = res.

Tu se lahko spremenljivka ključa izračuna v času izvajanja in je odvisna od vnosa uporabnika, nato pa se bo uporabila za dostop do lastnine. To daje programerjem večjo prilagodljivost. Dotted notation ni mogoče uporabiti na podoben način, saj bo prišlo do ponovitve predmeta JavaScript. Spodaj je primer.

Brute force javascript

Ustavni objekt

Navedeni objekt const se lahko spremeni. Primer je podan spodaj.

Ustavni objekt

Morda se zdi, da bo objekt JavaScript v nizu (*) povzročil napako, vendar ni. To je zato, ker const zajame vrednost samega uporabnika. Tukaj uporabnik ves čas vodi povezavo do istega objekta. Vrstica (*) gre znotraj predmeta, ni dodeljena uporabniku. Const bo dal napako, če poskusite namestiti uporabnika in nekaj drugega. Kloniranje in združevanje, Object.assign ustvari drugo povezavo do istega objekta, če ga želite podvojiti. To je tudi izvedljivo, vendar nekoliko bolj zapleteno, ker JavaScript nima vgrajene metode. Pravzaprav je to le redko potrebno. Kopiranje z referenco se uporablja v večini primerov. Če pa ga res potrebujete, morate ustvariti predmet JavaScript in podvojiti strukturo obstoječega s kopiranjem njegovih lastnosti na primitivni ravni. Spodaj je primer.

Ponovljena struktura

Za to lahko uporabite tudi metodo Object.assign. Argumenti dest in src1, ..., srcN so objekti. Kopira lastnosti vseh src1, ..., srcNINTO dest. Z drugimi besedami, lastnosti vseh argumentov, začenši z drugim, se kopirajo v prvo. Nato se vrne v dest. Z njim lahko na primer združite več predmetov v eno.

Združevanje več predmetov v eno

Uporabite lahko tudi Object.assign, da zamenjate preprosto klonsko zanko. Kopira vse uporabniške lastnosti v prazen objekt in ga vrne, tako kot zanko, vendar na kratko. Do sedaj je bilo predpostavljeno, da so vse uporabniške lastnosti primitivne. Ampak lastnosti so lahko reference na druge objekte.

Če želite to popraviti, morate uporabiti klonski cikel, ki preveri vsako vrednost uporabnika [key] in, če je objekt, nato podvoji njegovo strukturo. To imenujemo "globoko kloniranje".

Obstaja standardni algoritem za globoko kloniranje, ki obravnava zgornji primer in bolj zapletene primere, imenovane algoritem strukturiranega kloniranja. Da ne bi znova izumili kolesa, lahko uporabite delovno implementacijo iz lodash JavaScript knjižnice, metodo, imenovano _.cloneDeep (obj).

Napredne metode

Če programer prekine predmet in poskuša pridobiti vse lastnosti v istem vrstnem redu, v katerem so bile dodane, se lahko zanese na "naročanje na poseben način", ko so razvrščene celoštevilčne lastnosti, druge pa so oblikovane v vrstnem redu ustvarjanja predmeta JavaScript.

Napredne objektne metode obravnavajo koncepte, ki se redko uporabljajo v JavaScriptingu. To je posledica dejstva, da v običajnih scenarijih te močne funkcije niso potrebne. Nekatere od teh metod morda ne bodo delovale v starejših brskalnikih, kot so zgodnje izdaje Netscape 4.

Uporabo prototipa lahko uporabimo za izdelavo objektov JavaScript in vseh metod, ki jih uporablja mycircle, ne samo novih. To omogoča mešano obremenitev. Ni treba shranjevati ločenih kopij metod za vsak primerek objekta, zato lahko za delo porabi manj pomnilnika, vendar mora brskalnik poiskati trenutna in nadrejena območja, da jih najdejo. To lahko povzroči največjo zamudo. Običajno mora uporabnik uporabiti tisto, kar je primerno za kodo, in te odločitve ne temelji na uspešnosti, razen če se ukvarja z zelo specifičnim nadzorovanim okoljem.

Omejevanje zamude

Vrni true

V nekaterih primerih je morda potrebno, da je lastnost predmeta vezana na predmet samega ali nekje v prototipni verigi. V JavaScriptu vsi objekti uporabljajo metodo hasOwnProperty, ki vrne true, če je ta lastnost vezana na primerek posameznega objekta. V tem primeru je mogoče preveriti, ali ima konstruktor objekta isto lastnost z enako vrednostjo kot sam primerek objekta. To lahko povzroči napačen rezultat, če obstajajo ločene lastnosti predmeta JavaScript z isto vrednostjo za primer objekta in verigo prototipa. Metoda hasOwnProperty ima en sam parameter - ime lastnosti kot niz.

Metoda HasOwnProperty

Podobno lahko ustvarite zasebne metode. To je preprosto funkcija, ki se ustvari znotraj funkcije konstruktorja. Nekaterim se lahko zdi zmedeno, toda tako deluje. Zasebno funkcijo lahko pokliče samo konstruktor ali metode, ki so definirane v nizu. Uporabljajo se lahko kot javne metode, če so dodeljene javnemu konstruktorju in so dostopne z javnimi metodami objektov Javascript.

funkcija myob () {function cantBeSeen () {alert (secretValue);

} var secretValue = '';

this.method1 = function () {secretValue = 'brez presenečenj';

cantBeSeen ();

};

this.method2 = cantBeSeen;

} var oneOb = new myob ();

oneOb.method1 ();

// opozorila "brez presenečenj" oneOb.method2 ();

// opozarja „brez presenečenj“.

Ukazni vzorec

Objekti ukazov omogočajo ohlapno povezane sisteme z ločevanjem tistih, ki zahtevajo od objektov, in dejansko obdelajo zahtevo. Te zahteve se imenujejo dogodki, koda, ki obravnava zahteve, pa se imenuje rokovniki dogodkov.

Recimo, da so aplikacije ustvarjene, ki podpirajo akcijo odložišča Izreži, Kopiraj in Prilepi. Ta dejanja se lahko zaženejo na različne načine v celotni aplikaciji: sistem menijev, kontekstni meni, na primer z desnim klikom na polje z besedilom ali z uporabo bližnjice. Objekti ukazov omogočajo centralizacijo obdelave teh dejanj, eno za vsako operacijo, ko potrebujete le en ukaz za obdelavo vseh zahtev za rezanje, eno za vse zahteve kopiranja in eno za vse zahtevke za lepljenje.

Ker ukazi centralizirajo vso obdelavo, pogosto sodelujejo tudi pri obdelavi razveljavljenih funkcij za celotno aplikacijo. Znatne izboljšave je mogoče doseči z uporabo sodobnih metod JavaScript, kar vodi k ustvarjanju učinkovitejših, zanesljivejših in podprtih aplikacij.

Če želite izvedeti, kako to storiti, lahko uporabite predloge JavaScript + jQuery. Ta edinstven paket vključuje optimiziran JavaScript za vse GoF predloge z uporabo naprednejših funkcij, kot so imenski prostori, prototipi, moduli, funkcionalni objekti, zapiranja, anonimne funkcije in še več. Če uporabniki potrebujejo najnovejša orodja in metode za predloge JavaScript, predloge jQuery in arhitekture predlog, je to najboljši primer uporabe. Ta paket vsebuje dragocene, ažurne informacije za razvijalce JavaScripta. Vključeno je:

  1. Googlove predloge, optimizirane za JavaScript.
  2. Sodobni vzorci oblikovanja JavaScripta.
  3. Vzorec oblikovanja za ogled modelov.
  4. Predloge za oblikovanje JQuery.
  5. Arhitekturne predloge JavaScript idiomi.
  6. Primeri uporabe (MVC, SPA itd.)

Predlagani sintaktični temelji objektov JavaScript so zelo pomembni za začetnike programerjev. Najprej morate razumeti objekte, potem pa boste vedeli objektno usmerjeno programiranje. Izjemno pomembno je, da imamo globoko razumevanje tega gradiva, saj je to osnova za preostanek jezika JavaScript.