Nizovi su jedna od najčešće korištenih vrsta varijabli koje vam omogućuju pohranjivanje mnogih uzastopnih vrijednosti na "jednom mjestu". Međutim, kada je riječ o JavaScriptu, ima puno toga za odbaciti.

U ovom članku ćemo pogledati tri malo poznate tehnike koje možete primijeniti pri radu s nizovima.

1. Dodavanje prilagođenih svojstava u nizove

Ako koristite pretragu da biste pronašli definiciju niza u JavaScriptu, većina izvora će tvrditi da je zadana vrsta vrijednosti varijable predstavljena kao objekt.

Općenito govoreći, mnoge stvari na koje nailazimo u JavaScriptu su objekti. Bit će pošteno primijetiti da jezik također sadrži "primitivne" tipove podataka, ali se njihove vrijednosti na neki način koriste u svojstvima unutar objekata.

2. Pristup elementima niza unutar petlje

Budući da indeksi niza mogu imati samo pozitivne vrijednosti, ishodište počinje od nule. Nakon toga, možemo koristiti ovaj indeks za pristup elementu niza u ovoj iteraciji petlje.

ECMAScript6 je uveo način prolaska kroz niz bez korištenja indeksa i kroz novu petlju for… of.

Petlja for ... of je dizajnirana za ponavljanje elemenata niza bez utjecaja na indeks elementa.

Var ary = ["naranča", "jabuka", "liči"]; for (neka stavka ary) (console.log (item);) // "orange", "apple", "lychee" Za usporedbu: prikaz indeksa stavki u for petlji. var ary = ["naranča", "jabuka", "liči"]; za (var stavka = 0; stavka< ary.length; item++){ console.log(item); } // 0, 1, 2

3. Broj elemenata nije dimenzija niza

Kada govorimo o dimenziji niza, obično mislimo da mislimo na broj elemenata pohranjenih u njemu. Zapravo, to nije sasvim točno - svojstvo duljine izračunava se ovisno o maksimalnom indeksu elementa.

Svojstvo duljine vrlo je dvosmisleno. Da biste se u to uvjerili, samo pogledajte sljedeće manipulacije:

Var ary =; ary.duljina = 3; console.log (ary.length); // 3 ary = "abcd"; console.log (ary.length); // 6

U posljednjem primjeru bilo je dovoljno staviti element na petu poziciju, zbog čega je duljina niza postala jednaka 6. Ako mislite da će se indeksi od 0 do 4 automatski kreirati, tada ćete biti krivo. To se može provjeriti pomoću operatora in.

Var ary =; ary.duljina = 3; console.log (ary.length); // 3 ary = "abcd"; console.log (ary.length); // 6 console.log (0 u ary); // lažno

U ovom slučaju, bilo bi pošteno nazvati niz ary "sparse".

Također možemo manipulirati svojstvom duljine kako bismo skratili nizove. Sljedeći primjer pokazuje "gubitak" elementa na indeksu 5 smanjenjem vrijednosti svojstva duljine niza ary.

Var ary =; ary.duljina = 3; console.log (ary.length); // 3 ary = "abcd"; console.log (ary.length); // 6 ary.length = 2; console.log (ary.length); // 2 console.log (ary); // nedefiniran

Opisao sam samo dio metoda za rad s nizovima.

Ovdje ćemo govoriti o dodavanju, uklanjanju elemenata niza. O invertiranju i sortiranju niza, kao i rezanju, zamjeni i kombiniranju nizova.

Dodavanje elemenata u niz.

Možete koristiti svojstvo dužine za dodavanje novih elemenata u niz:

Var myArray = ["Apple", "Microsoft", "Google", "Facebook"]; myArray = "Yahoo!"; console.log (myArray); // ["Apple", "Microsoft", "Google", "Facebook", "Yahoo!"]

Ovo će uspjeti jer elementi niza su numerirani od nule, i duljina još jedan. Duljina uvijek ekvivalentan indeks + 1 pa je vrlo lako dodati novi element na kraj niza. Čudno, ali možete dodati element na poziciju koja je mnogo veća od duljine samog niza:

Var myArray = ["Jimi Hendrix", "Eric Clapton", "Jimmy Page", "Keith Richards"]; myArray = "Lindsey Buckingham"; console.log (myArray); // ["Jimi Hendrix", "Eric Clapton", "Jimmy Page", "Keith Richards", nedefinirano × 95, "Lindsey Buckingham"] console.log (myArray.length); // jedna stotina

Kao što je prikazano u komentarima, 95 praznih mjesta i element "Lindsey Buckingham" bit će dodani na kraj niza. Nakon toga dobivamo duljinu 100. Drugi način dodavanja novog elementa u niz je korištenje metode pritisnite ():

Var myArray = ["Paul McCartney", "John Lennon", "George Harrison"]; myArray.push ("Ringo Starr", "George Martin"); console.log (myArray); // ["Paul McCartney", "John Lennon", "George Harrison", "Ringo Starr", "George Martin"]

Metoda gurati () uvijek vraća novu duljinu niza (u našem slučaju 5). Možete dodati stavku pomoću spoj ():

Var myArray = ["žir", "bukva", "mongongo", "makadamija"]; myArray.splice (2, 0, "indijski orah"); // dodaje "indijski orah" u indeks 2 console.log (myArray); // ["žir", "bukva", "indijski orah", "mongongo", "makadamija"]

Kada je drugi argument 0, to znači da nijedan element neće biti uklonjen, te će stoga svi sljedeći argumenti biti dodani u niz na poziciji navedenoj u prvom argumentu.

Uklanjanje elemenata iz niza

Uklanjanje elementa je malo teže od dodavanja. Za uklanjanje elementa s kraja niza može se koristiti pop ():

Var myArray = ["7-up", "Sprite", "Ginger Ale", "Lemonade"]; myArray.pop (); console.log (myArray); // ["7-up", "Sprite", "Ginger Ale"]

Metoda pop () uvijek uklanja zadnji element u nizu i vraća ga.

Također možete koristiti spajanje () metoda:

Var myArray = ["maniokoka", "muškatni oraščić", "lupin", "rabarbara"]; myArray.splice (2, 1); // ukloniti element na indeksu 2 console.log (myArray); // ["maniokoka", "muškatni oraščić", "rabarbara"]

Za razliku od metode spajanje (), koji se koristi za dodavanje elemenata, ovdje je drugi argument 1, što govori da želimo ukloniti element s indeksom 2 (ili 3. po redu). U ovom slučaju, element "lupin" je uklonjen.

Pomoću operatora možete ukloniti element iz niza izbrisati:

Var myArray = ["Byte Bandit", "Eliza", "Jeefo", "Michelangelo"]; console.log (myArray.length); // 4 izbrisati myArray; // ukloniti Eliza console.log (myArray.length); // 4 console.log (myArray); // ["Byte Bandit", nedefinirano × 1, "Jeefo", "Michelangelo"]

Prva važna napomena: izbrisati () ne mijenja duljinu niza nakon uklanjanja elementa (čak i ako je bio zadnji element u nizu). Drugi: izbrisati () mijenja vrijednost uklonjenog elementa u nedefiniranu, pa pri preokretu myArray = nedefinirano.

Dobar način za uklanjanje elementa iz niza je korištenje Array.remove Johna Resiga. Ispod je primjer upotrebe preuzet s njegove stranice:

// Ukloni polje - Autor John Resig (licencirani MIT) Array.prototype.remove = funkcija (od, do) (var rest = this.slice ((do || from) + 1 || this.length); this.length = od< 0 ? this.length + from: from; return this.push.apply(this, rest); }; // Удаление 2 элемента из массива array.remove(1); // Удаление 2-ого элемента с конца массива array.remove(-2); // Удаление второго и третьего элемента array.remove(1,2); // Удаление последнего и предпоследнего элемента array.remove(-2,-1);

Možda biste željeli pogledati rješenje Viral Patela, jednu od funkcija u Underscore.js, ili jQueryjev grep ().

Osim toga, u JavaScript postoji metoda pomak (), koji uklanja prvi element u nizu i vraća njegovu vrijednost. Pogledajmo kod:

Var myArray = ["Matt Kramer", "Jason Bieler", "Tom Defile", "Phil Varone"]; console.log (myArray.length); // 4 var firstItem = myArray.shift (); console.log (firstItem); // Matt Kramer console.log (myArray.length); // 3 console.log (myArray); // ["Jason Bieler", "Tom Defile", "Phil Varone"]

Koristeći metodu pomak () uklonili smo stavku, ali smo spremili njezinu vrijednost u našu varijablu firstIte. Duljina niza se promijenila sa 4 na 3.

Ova metoda može biti korisna u kombinaciji s metodom pritisnite (). Koristeći ih zajedno, možemo učinkovito staviti elemente u red u nizu. Duljinu niza zadržavamo uklanjanjem elementa s početka i dodavanjem novog na kraj.

Naprotiv, možemo koristiti metodu poništiti () da dodate element na početak niza:

Var myArray = ["apito", "castanets", "maraca"]; console.log (myArray.length); // 3 myArray.unshift ("chime bar", "tan-tan"); console.log (myArray.length); // 5 console.log (myArray); // ["chime bar", "tan-tan", "apito", "castanets", "maraca"]

Koristeći metodu poništiti () s metodom pop (), možete staviti u red unatrag dodavanjem elemenata na početak i uklanjanjem s kraja niza.

Preokret i sortiranje elemenata niza.

Za okretanje elemenata u nizu možemo koristiti obrnuto ():

Var myArray = ["odbrojavanje", "konačno", "the"]; console.log (myArray); // ["countdown", "final", "the"] myArray = myArray.reverse (); console.log (myArray); // ["završno odbrojavanje"]

Pomoću metode moguće je razvrstavanje elemenata niza po abecedi sortiraj ():

Var myArray = ["ksilofoni", "zebre", "jagernauti", "avokado"]; console.log (myArray); // ["ksilofoni", "zebre", "jaggernauti", "avokado"] myArray = myArray.sort (); console.log (myArray); // ["avokado", "juggernauti", "ksilofoni", "zebre"]

Ali to neće raditi s brojevima.

Var myArray =; console.log (myArray); // myArray = myArray.sort (); console.log (myArray); //

Ako trebate razvrstati brojeve, onda možete koristiti sljedeći kod:

Funkcija compareNumbers (a, b) (vraćanje a - b;) var myArray =; console.log (myArray); // myArray = myArray.sort (usporedi Brojeve); console.log (myArray); //

Kao što je gore prikazano s jednostavnom funkcijom zalijepljenom sortiraj (), niz koji sadrži brojeve bit će ispravno sortiran.

Kombiniranje nizova.

Možete spojiti 2 ili više nizova i dobiti 1 niz koji sadrži elemente spojenih nizova. Za to koristimo metodu spoj ():

Var myArray = ["Jay Ferguson", "Andrew Scott"]; var myArray2 = ["Chris Murphy", "Patrick Pentland"]; var myNewArray = myArray.concat (myArray2); console.log (myNewArray); // ["Jay Ferguson", "Andrew Scott", "Chris Murphy", "Patrick Pentland"]

Var myArray = ["Jay Ferguson", "Andrew Scott"]; var myNewArray = myArray.concat ("Chris Murphy", "Patrick Pentland"); console.log (myNewArray); // ["Jay Ferguson", "Andrew Scott", "Chris Murphy", "Patrick Pentland"]

Dijeljenje niza.

Pomoću funkcije možete stvoriti novi niz koji sadrži 1 ili više elemenata iz postojećeg niza kriška ():

Var myArray = ["Vokali", "Bas", "Gitara", "Bubnjevi", "Jabuke", "Naranče"]; var myNewArray = myArray.slice (4); console.log (myNewArray); // ["Jabuke", "Naranče"]

Metoda kriška () uzima 1 ili 2 argumenta. Ako je proslijeđen 1 argument (indeks), tada se stvara novi niz od svih elemenata starog, počevši od zadanog indeksa. Ako su proslijeđena 2 argumenta, tada se stvara novi niz od elemenata počevši od prvog argumenta pa do elementa u indeksu koji je proslijeđen u drugom parametru, ne uključujući zadnji. Da bi bilo jasnije, pogledajmo kod u nastavku:

Var myArray = ["Vokali", "Bas", "Gitara", "Bubnjevi", "Jabuke", "Naranče"]; var myNewArray = myArray.slice (0, 4); console.log (myNewArray); // ["Vokali", "Bas", "Gitara", "Bubnjevi"]

Zamjena elemenata u nizu.

Koristimo spajanje () za uklanjanje elemenata iz niza, ali također možemo zamijeniti element u nizu novim elementima:

Var myArray = ["Rivers Cuomo", "Patrick Wilson", "Brian Bell", "Matt Sharp"]; myArray.splice (3, 1, "Scott Shriner"); // zamijeniti 1 element indeksom 3 console.log (myArray); // ["Rivers Cuomo", "Patrick Wilson", "Brian Bell", "Scott Shriner"]

Metoda spajanje () uvijek vraća niz koji sadrži elemente koji su uklonjeni. Redak 2 vraća 1 stavku "Brian Bell".

Zaključak

Ovi članci opisuju metode za rad s nizovima u JavaScriptu. Neki dodatni elementi mogu se vidjeti na MDN-u koje nisam uključio u ovaj post. Oni rade samo u IE9 +, pa možda neće biti korisni.

Želite li što dodati? Ili znate neku zanimljivu biblioteku koja će vam pomoći u upravljanju nizovima? Molimo komentirajte!

U ovom članku ćemo pogledati JavaScript niz i njegove sastavne dijelove. JavaScript je idealno dizajniran za programiranje. Zapravo, implementira jezik ECMAScript (referenca ECMA-262).

Gdje se koristi JavaScript? Koristi se kao ugrađeni jezik kako bi se definirao programski put do predmeta aplikacije. Može se naći u preglednicima: tamo se koristi kao skriptni jezik koji web stranicama daje interaktivnost.

Najvažnije arhitektonske značajke ovog proizvoda su dinamično i slabo tipkanje, automatsko upravljanje memorijom, savršeno programiranje, funkcije koje su objekti prve kategorije.

Općenito, na JavaScript su utjecali različiti razlozi, jer su tijekom razvoja htjeli stvoriti jezik sličan Javi, ali jednostavan za korištenje programerima. Usput, JavaScript nije u vlasništvu nijednog poduzeća ili organizacije, što ga čini za razliku od brojnih stilova programiranja koje koriste web programeri.

Imajte na umu da je JavaScript registrirani zaštitni znak tvrtke Oracle Corporation.

Što je niz?

Niz se naziva niz koji pohranjuje numerirane vrijednosti. Svaka takva vrijednost se naziva komponentom niza, a znamenka kojoj je komponenta pridružena naziva se indeksom. JavaScript polje nije upisano. To znači da dijelovi niza mogu biti bilo koje vrste, a različiti dijelovi koji pripadaju istom nizu su potpuno različitih tipova.

Osim toga, JavaScript niz je dinamičan, što znači da nema potrebe za deklariranjem fiksne veličine. Uostalom, u bilo kojem trenutku možete dodati nove detalje.

Proizvodnja niza

Koristeći JavaScript, stvaranje niza uopće nije teško. Za to postoje dvije metode. Prvi uključuje izradu niza pomoću doslovnog - uglatih zagrada, unutar kojeg je popis dijelova odvojenih zarezima.

• var prazno =; // prazan niz;
• var brojevi =; // niz s pet digitalnih komponenti;
• var diff =; // niz s tri elementa različitih tipova.

Obično to ne zahtijeva da vrijednosti budu jednostavne (nizovi i brojevi). To također može biti bilo koji drugi izraz, na primjer, literali subjekta, druge funkcije i nizovi.

Drugi način stvaranja niza je pozivanje dizajnerskog polja (). Možete ga pozvati na tri načina:

• Pozivanje dizajnera bez razloga: var b - novi niz (). To omogućuje stvaranje praznog niza ekvivalentnog praznom literalu.
• Konstruktor eksplicitno specificira vrijednost n komponenti niza: var b = novi niz (1, 3, 5, 8, "string", true). U ovom slučaju, dizajneru se prikazuje popis argumenata koji se pretvaraju u komponente novog niza. Argumenti se zapisuju u niz na mjestu na kojem su navedeni.
• Određivanje površine za naknadnu dodjelu vrijednosti. To se postiže tako da se prilikom otkrivanja niza navede jedan broj zatvoren u zagrade: var b = novi niz (5). Ova metoda detekcije uključuje dodjeljivanje potrebnog broja komponenti nizu (od kojih je svaka navedena kao nedefinirana) s mogućnošću naknadne dodjele vrijednosti tijekom prezentacije. Ovaj obrazac se obično koristi za prethodno postavljanje Javascript niza čija je duljina unaprijed poznata.

Pisanje, čitanje i dodavanje detalja niza

Do komponenti niza možete doći pomoću operatora. Usput, sve komponente u JavaScriptu su numerirane počevši od nule. Da biste dobili potrebnu stavku, navedite njen broj u. U pravilu se pojedinosti mogu mijenjati. A da biste dodali JavaScript u niz, trebate samo dodijeliti novu vrijednost.

Treba napomenuti da JavaScript nizovi mogu pohraniti bilo koji broj elemenata bilo koje vrste.

Duljina niza

Dakle, znamo, duljina niza općenito je zanimljiv fenomen. Razmotrimo ga detaljnije. Svi nizovi, bilo da su izrađeni pomoću dizajnera Array () ili identificirani pomoću literala polja, imaju specifično svojstvo duljine koje priziva ukupan broj pohranjenih elemenata. Budući da niz može sadržavati nedefinirane detalje (označene s nedefinirano), točniji izraz zvuči ovako: kvaliteta duljine je uvijek veća za jedan od najvećeg broja (indeksa) komponente polja. Kvaliteta duljine automatski se prilagođava kako bi ostala točna kada se novi dijelovi pojave u nizu.

Možete koristiti svojstvo duljine da bi se pojavila zadnja komponenta niza.

Posljednji dio ima indeks jedan manji od veličine niza. Uostalom, odbrojavanje uvijek počinje od nule. Oh, ovaj JavaScript! Duljina niza ovisi o točnom broju elemenata. Stoga, ako ne znate koliko bi ih trebalo biti, ali se trebate pozvati na završni element niza, trebate koristiti notaciju: v.length - 1.

Iteracija preko detalja niza

Vrlo često se svojstvo duljine koristi za ponavljanje detalja niza u petlji:

• var fruits = ["jagoda", "breskva", "jabuka", "banana"];
• za (var I = 0; i< fruits.lenght; i++);
• dokument.pisati (plodovi [i] + "...").

U ovom primjeru čini se da su komponente ugniježđene uzastopno i počinju od prvog dijela koji je indeksiran na nuli. Ako to nije slučaj, prije pozivanja svakog elementa niza potrebno je provjeriti je li definiran.

Petlja se također ponekad koristi za inicijalizaciju komponenti.

Uzgoj i skraćivanje niza

Pitam se kako koristiti JavaScript za dodavanje niza u niz? U procesu rada s nizovima automatski se poboljšava kvaliteta duljine, zbog čega se moramo sami pobrinuti za to. Jedna stvar koju treba zapamtiti je da svojstvo duljine nije samo čitljivo, već i upisano. Ako se kvaliteti duljine dodijeli vrijednost koja je manja od trenutne, tada se niz smanjuje na navedenu vrijednost. Sve komponente koje nisu u novom rasponu indeksa se odbacuju i njihove vrijednosti se gube, čak i ako se duljina kasnije vrati — vrijednosti se ne vraćaju.

Vrlo je lako izbrisati niz ovako: foo.length = 0.

Ako je kvaliteta duljine veća od trenutne vrijednosti, novi neidentificirani detalji će se pojaviti na kraju niza, što će ga povećati na potrebnu veličinu.

Uklanjanje dijelova uzorka

Operator delete navodi nedefinirano u komponenti polja, ali nastavlja postojati. Ako trebate ukloniti element iz JavaScript niza tako da se preostali dijelovi pomaknu u slobodni prostor, trebate koristiti jednu od unaprijed definiranih metoda niza. Metoda Array.shift () eliminira prvu komponentu, pop () završnu komponentu, a metoda splice () eliminira jednu ili niz komponenti bilo gdje u nizu.

Nizovi su višedimenzionalni

Čini se da smo to malo shvatili, dvodimenzionalni nizovi su ono što treba razmotriti sljedeće. Zapamtite da JavaScript nizovi mogu sadržavati druge elemente kao komponente? Ova značajka se koristi za izradu višedimenzionalnih nizova. Da biste posjetili komponente u nizu nizova, dovoljno je dvaput primijeniti uglate zagrade.

Asocijativni nizovi

Sada istražimo kako zaštitni znak JavaScript koristi asocijativne nizove. Da bismo to učinili, moramo pogledati u teoriju: asocijativni nizovi se ponekad nazivaju hash tablicama. Zahvaljujući njima, umjesto indeksa se koriste nizovi. Upotreba takvih konstrukcija slična je korištenju imena svojstva jednostavnog objekta, ali u ovom slučaju, kada se rad izvodi u formatu polja. Budući da u JavaScriptu nema načina rada s asocijativnim nizovima, oni se koriste mnogo rjeđe od običnih. Treba napomenuti da oni još uvijek mogu biti korisni za pohranu podataka i olakšati pamćenje pojedinosti kojima je potrebno pristupiti.

Izlaz niza

Što sada učimo u JavaScript sustavu? Prikaz niza u dijaloškom okviru (na zaslonu monitora), kao i prikaz vrijednosti komponenti niza.

Ako trebate prikazati vrijednosti svih komponenti u programu, onda je zgodno koristiti izraz for za to. Zanimljivo je da se varijabla brojača pravila for koristi kao indeks komponente niza.

Čišćenje

Da biste filtrirali JavaScript polje, morate nulti njegovu duljinu:

• var myArray =;
• myArray.length = 0.

• jasno: funkcija () (;
• ovo.dužina = 0;
• vrati ovo;

Dodavanje i uklanjanje komponenti

Pa, nastavimo dalje proučavati ovaj zanimljivi JavaScript jezik. Element polja može se ukloniti i dodati na isti način kao i obična svojstva drugih objekata. Ali postoje neke razlike: dodavanje numeričkih svojstava može promijeniti kvalitetu duljine, a izmjena svojstva duljine može eliminirati numeričke kvalitete. U principu, algoritam za postavljanje kvaliteta nizova je sljedeći:

• Prilikom dodavanja nepoznatog digitalnog svojstva i, ako je duljina jednaka ili manja od i, duljina se određuje kao i + 1.
• Prilikom promjene kvalitete duljine izvode se sljedeće radnje: ako je dodijeljena vrijednost manja od nule, tada se baca RangeError. Eliminiraju se sve brojčane kvalitete i indeksi koji su jednaki novoj duljini i koji su veći.

Općenito, uklanjanje elementa iz JavaScript polja nije teško. Uostalom, čak i postavljanje duljine, morate ukloniti "dodatne" komponente iz nje. Stoga slijedi opcija čišćenja niza. Ako dodijeljena varijabla praznog novog niza iz nekog razloga ne odgovara, ali je potrebno nulirati trenutnu, dovoljno je kvaliteti duljine dodijeliti vrijednost nule.

Metode poništavanja, pomicanja, iskakanja i pritiska

Iako se komponente niza ručno mijenjaju, mnogi preporučuju korištenje ugrađenih metoda za to. Upravo ta nijansa jamči ispravnu vrijednost kvalitete duljine i odsutnost praznina u nizu. Usput, ispravna duljina kvalitete odgovarat će broju komponenti.

Push metoda prenosi prenesene dijelove na kraj niza. Pop metoda vraća završnu komponentu i uklanja je.

Općenito, u Internet Exploreru ranijem od osme verzije, unshift može vratiti nedefiniranu, u drugim preglednicima - novu vrijednost za duljinu. Stoga je bolje ne oslanjati se na povratnu vrijednost iz unshifta.

Dodavanje i uklanjanje dijelova u sredini uzorka

Ako trebate izbrisati JavaScript polje, što trebate učiniti? Poznato je da metoda spajanja ima potpis Array.prototype.splice.

Uklanja deleteCount komponenti iz niza, počevši od početnog indeksa. Ako je proslijeđeno više od dva argumenta, svi sljedeći argumenti u nizu se stavljaju umjesto poništenih. Ako je početak minus, tada će indeks s kojeg će se nastaviti naplata biti jednak duljini + početak. Povratak u niz događa se iz uklonjenih elemenata.

Zapravo, koristeći metodu spajanja, možete ukloniti komponente iz sredine niza ili dodati koliko god želite bilo gdje u nizu.

U najjednostavnijem obliku, ako trebate izbrisati komponentu s indeksom i, trebate zatražiti metodu spajanja iz niza s parametrima i i 1.

U osnovi, drugi parametar za metodu spajanja nije obavezan, ali ponašanje funkcije s jednim argumentom razlikuje se u svakom pregledniku.

Na primjer, u Firefoxu, u najnovijim varijacijama Opera, u Safariju i u Chromeu, svi detalji će biti uklonjeni do kraja niza.

Nijedna komponenta neće biti eliminirana u IE. U prvim verzijama Opere ponašanje se ne može predvidjeti - jedan dio s indeksom start - 1 bit će uklonjen. Stoga ovoj metodi uvijek trebate proslijediti najmanje dvije komponente.

Ključevi

Naravno, prilikom učenja JavaScripta, asocijativni nizovi, kao što je ranije spomenuto, također se moraju imati na umu. Ovo je apstraktna vrsta informacija (sučelje za pohranu podataka), koja vam omogućuje spremanje parova oblika "(ključ, vrijednost)" i podržava operacije dodavanja para, kao i uklanjanje i traženje para pomoću ključ:

PRONAĐI (ključ).

INSERT (vrijednost, ključ).

UKLONITI (ključ).

Pretpostavlja se da se dva para sa sličnim ključevima ne mogu pohraniti u asocijativni niz. U paru k + v, v se zove vrijednost povezana s ključem k. Semantika i nazivi gornjih operacija u različitim implementacijama takvih nizova mogu biti različiti.

Dakle, akcija FIND (ključ) vraća vrijednost pridruženu danom ključu, ili nekom specifičnom UNDEF objektu, što znači da ne postoji vrijednost pridružena zadanom ključu. Druge dvije akcije ne vraćaju ništa (osim je li operacija bila uspješna).

Općenito, sa stajališta sučelja, prikladno je asocijativni niz smatrati jednostavnim nizom, u kojem se kao indeksi mogu koristiti ne samo cijeli brojevi, već i vrijednosti drugih vrsta, na primjer, nizovi.

Usput, podrška za takve nizove dostupna je u mnogim interpretiranim programskim jezicima visoke razine kao što su PHP, Perl, Ruby, Python, Tcl, JavaScript i drugi. Za jezike koji nemaju ugrađene alate za rad s asocijativnim nizovima, stvoren je ogroman broj implementacija u obliku knjižnica.

Primjer asocijativnog niza je telefonski imenik. U ovoj varijanti vrijednost je kompleks "F. Ime + adresa", a ključ - telefonski broj. Jedan telefonski broj ima jednog vlasnika, ali jedna osoba može posjedovati više brojeva.

Asocijativna proširenja

Treba napomenuti da najpoznatija proširenja uključuju sljedeće radnje:

• SVAKI - "prošetati" kroz sve parove da se spasi.
• CLEAR - ukloniti sve zapise.
• MIN - pronađite par s najnižom vrijednošću ključa.
• MAX - pronađite par s najvećom vrijednošću ključa.

U posljednje dvije opcije morate odrediti radnju usporedbe na tipkama.

Implementacije asocijativnog niza

Postoji mnogo različitih implementacija asocijativnog niza. Najčešća implementacija može se temeljiti na jednostavnom nizu, čije su komponente parovi (vrijednost, ključ). Da biste ubrzali radnje pretraživanja, možete sortirati komponente ovog niza po ključu i pronaći pomoću Ali to će povećati vrijeme potrebno za dodavanje novog para, budući da ćete morati "razdvojiti" komponente niza kako biste pakirali svježi zapis u praznu ćeliju koja se pojavi.

Najpoznatije implementacije temelje se na raznim stablima pretraživanja. Na primjer, u tipičnoj čitaonici C ++ STL, spremnik karte implementiran je na temelju crno-crvenog stabla. U stilovima Ruby, Tcl, Python koristi se jedna od vrsta hash tablica. Postoje i druge implementacije.

Općenito, svaka implementacija ima svoje prednosti i nedostatke. Važno je da se sve tri radnje izvode i u prosjeku iu najgoroj nijansi u razdoblju od O (log n), gdje je n trenutni broj spremljenih parova. Za podudarna stabla pretraživanja (uključujući crno-crvena stabla) ovaj je uvjet ispunjen.

Poznato je da se u implementacijama temeljenim na hash tablicama prosječno vrijeme definira kao O (1), što je bolje nego u akcijama temeljenim na stablima pretraživanja. Naravno, to ne jamči brzo izvođenje pojedinačnih operacija: trajanje INSERT-a je u najgorem slučaju označeno kao O (n). Proces INSERT traje dugo, kada faktor popunjavanja dosegne svoju najvišu točku i postaje potrebno rekonstruirati indeks hash tablice.

Inače, ovi hash-listi su loši jer se ne mogu koristiti za brze dodatne radnje MAX, MIN i algoritam za zaobilaženje svih spremljenih parova u opadajućem ili rastućem redoslijedu ključeva.

• Prijevod

Većina aplikacija koje se danas razvijaju moraju biti u interakciji s nekom vrstom skupa podataka. Rukovanje stavkama u zbirkama uobičajena je operacija s kojom ste se možda susreli. Kada radite, na primjer, s nizovima, možete bez oklijevanja koristiti uobičajenu for petlju, koja izgleda otprilike ovako: for (var i = 0; i< value.length; i++){} . Однако, лучше, всё-таки, смотреть на вещи шире.

Pretpostavimo da trebamo prikazati popis proizvoda i, ako je potrebno, podijeliti ga u kategorije, filtrirati, pretražiti, izmijeniti ovaj popis ili njegove elemente. Možda ćete morati brzo izvesti neke izračune koji uključuju elemente popisa. Recimo da nečemu trebate dodati nešto, nešto pomnožiti s nečim. Možete li pronaći alate u JavaScriptu koji čine bržim i praktičnijim rješavanje takvih problema od korištenja obične for petlje?

Zapravo, JavaScript pruža takve mogućnosti. O nekima od njih raspravlja se u materijalu čiji prijevod danas predstavljamo vašoj pozornosti. Konkretno, govorimo o operatoru proširenja, for ... petlje i metodama include (), some (), every (), filter (), map () i reduce (). Ovdje ćemo uglavnom govoriti o nizovima, ali tehnike o kojima se ovdje raspravlja obično su prikladne za rad s drugim vrstama objekata.

Treba napomenuti da pregledi suvremenih pristupa razvoju u JS-u obično uključuju primjere pripremljene pomoću funkcija strelica. Možda ih ne koristite baš često – možda zato što vam se ne sviđaju, možda zato što ne želite provoditi previše vremena učeći nešto novo, ili vam jednostavno ne idu. Stoga će se ovdje u većini situacija prikazati dvije opcije za izvođenje istih radnji: korištenje običnih funkcija (ES5) i korištenje funkcija strelica (ES6). Za one nove funkcije strelice, imajte na umu da funkcije strelice nisu ekvivalentne deklaracijama funkcija i funkcijskim izrazima. Ne vrijedi zamijeniti jedno drugim. Konkretno, to je zbog činjenice da se ova ključna riječ različito ponaša u običnim funkcijama i funkcijama strelice.

1. Operator proširenja

Operator širenja omogućuje vam da "proširite" nizove zamjenom njihovih elemenata umjesto nizova na mjestu gdje se koristi ovaj operator. Sličan pristup je predložen za objektne literale.

▍ Prednosti operatera širenja

• Ovo je jednostavan i brz način za "izvlačenje" njegovih pojedinačnih elemenata iz niza.
• Ovaj operator je prikladan za rad s literalima polja i objekta.
• To je brza i intuitivna metoda za rad s argumentima funkcije.
• Operator širenja ne zauzima puno mjesta u kodu - izgleda kao tri točke (...).

▍ Primjer

Recimo da imate zadatak navesti svoje omiljene poslastice bez upotrebe petlje. S operatorom širenja to se radi ovako:

2. For… petlje

Naredba for… of je namijenjena prelasku kroz objekte koji se mogu ponavljati. Omogućuje pristup pojedinačnim elementima takvih objekata (osobito elementima nizova), što, na primjer, omogućuje njihovu promjenu. Može se smatrati zamjenom za običnu for petlju.

▍Snage for... of petlje

• Ovo je jednostavan način za dodavanje ili ažuriranje stavki zbirke.
• Petlja for… of vam omogućuje izvođenje različitih izračuna koristeći elemente (zbrajanje, množenje itd.).
• Zgodno ga je koristiti kada trebate provjeriti bilo koje uvjete.
• Njegovo korištenje dovodi do čišćeg i čitljivijeg koda.

▍ Primjer

Pretpostavimo da imate strukturu podataka koja opisuje sadržaj okvira s alatima i želite prikazati te alate. Evo kako to učiniti s for ... petlje:

3. Metoda uključuje ().

Metoda uključuje () koristi se za provjeru prisutnosti određenog elementa u kolekciji, posebno, na primjer, određenog niza u nizu koji sadrži nizove. Ova metoda vraća true ili false ovisno o rezultatima provjere. Kada ga koristite, treba imati na umu da je osjetljiv na velika i mala slova. Ako, na primjer, zbirka ima element niza SCHOOL, a provjera njegove prisutnosti pomoću uključuje () izvodi se na školskom nizu, metoda će vratiti false.

▍ Prednosti metode uključuje ().

• Metoda uključuje () korisna je za stvaranje jednostavnih mehanizama za pronalaženje podataka.
• Programeru daje intuitivan način da odredi jesu li neki podaci u nizu.
• Prikladno ga je koristiti u uvjetnim izrazima za modificiranje, filtriranje elemenata i za izvođenje drugih operacija.
• Njegova uporaba dovodi do poboljšane čitljivosti koda.

▍ Primjer

Pretpostavimo da imate garažu predstavljenu nizom s popisom automobila, a ne znate postoji li određeni automobil u ovoj garaži ili ne. Da biste riješili ovaj problem, morate napisati kod koji vam omogućuje provjeru prisutnosti automobila u garaži. Upotrijebimo metodu uključuje () :

4. Metoda some ().

Metoda some () omogućuje vam da provjerite postoje li neki od elemenata koje tražite u nizu. Na temelju rezultata provjere vraća true ili false. Slična je gornjoj metodi include (), osim što je njezin argument funkcija, a ne, na primjer, običan niz.

▍Neke () prednosti metode

• Metoda some () omogućuje nam da provjerimo sadrži li niz barem jedan od zanimljivih elemenata.
• Provjerava uvjet koristeći funkciju koja mu je proslijeđena.
• Ova metoda je prikladna za korištenje.

▍ Primjer

Pretpostavimo da ste vlasnik kluba i općenito vas ne zanima tko točno dolazi u vaš klub. No, pojedinim posjetiteljima nije dopušten ulazak u klub jer su skloni prekomjernoj konzumaciji alkoholnih pića, barem ako su sami u vašem objektu, a s njima nema tko paziti na njih. U tom slučaju grupa posjetitelja može ući u klub samo ako barem jedan od njih ima najmanje 18 godina. Kako bismo automatizirali ovu vrstu provjere, koristit ćemo metodu some (). U nastavku je prikazana njegova primjena u dvije verzije.

ES5

ES6

5. Svaki () metoda

Svaka () metoda prolazi kroz niz i provjerava svaki njegov element u odnosu na određeni uvjet, vraćajući true ako svi elementi niza ispunjavaju uvjet, i false u suprotnom. Primijetit ćete da je slična metodi some ().

▍ Prednosti svake () metode

• Metoda every () omogućuje vam da provjerite odgovaraju li svi elementi u nizu uvjet.
• Uvjeti se mogu postaviti pomoću funkcija.
• Promiče deklarativni pristup programiranju.

▍ Primjer

Vratimo se na prethodni primjer. Tamo ste u klub dopustili posjetitelje mlađe od 18 godina, ali je netko napisao izjavu policiji, nakon čega ste došli u neugodnu situaciju. Nakon što je sve bilo riješeno, zaključili ste da vam sve to ne treba i pooštrili ste pravila posjeta klubu. Sada grupa posjetitelja može ući u klub samo ako svaki član grupe ima najmanje 18 godina. Kao i prošli put, razmotrit ćemo rješenje problema u dvije verzije, ali ovaj put ćemo koristiti metodu svaki ().

ES5

ES6

6. Metoda filtera ().

Metoda filter () omogućuje vam stvaranje, na temelju određenog niza, novog niza koji sadrži samo one elemente izvornog niza koji zadovoljavaju navedeni uvjet.

▍ Prednosti filtera () Metoda

• Metoda filter () izbjegava modificiranje izvornog niza.
• Omogućuje vam da se riješite nepotrebnih elemenata.
• Poboljšava čitljivost vašeg koda.

▍ Primjer

Pretpostavimo da s popisa cijena trebate odabrati samo one koje su veće ili jednake 30. Za rješavanje ovog problema upotrijebimo metodu filter ().

ES5

ES6

7. Metoda karte ().

Metoda map () slična je metodi filter () po tome što također vraća novi niz. Međutim, koristi se za modificiranje elemenata izvornog niza.

▍Snage metode karte ().

• Metoda map () izbjegava potrebu za izmjenom elemenata izvornog niza.
• Prikladno je modificirati elemente niza uz njegovu pomoć.
• Poboljšava čitljivost vašeg koda.

▍ Primjer

Pretpostavimo da imate popis proizvoda s cijenama. Vaš upravitelj treba novu listu proizvoda s cijenama sniženim za 25%. Za rješavanje ovog problema upotrijebimo metodu map ().

ES5

ES6

8. smanjiti () metoda

Metoda reduciranja () u svom najjednostavnijem obliku omogućuje zbrajanje elemenata numeričkih nizova. Drugim riječima, pretvara niz u jednu vrijednost. To mu omogućuje da se koristi za različite izračune.

▍Snage metode smanjenja ().

• Metoda reducira () može se koristiti za izračunavanje zbroja ili prosjeka elemenata u nizu.
• Ova metoda ubrzava i pojednostavljuje izračune.

▍ Primjer

Pretpostavimo da trebate izračunati svoje troškove za tjedan, koji su pohranjeni u nizu. Riješimo ovaj problem pomoću metode reduciranja ().

ES5

ES6

Dodaj oznake

• Prijevod

• I. Iteracija preko realnih nizova
  1. ForEach metoda i srodne metode
  2. Za petlju
  3. Ispravna upotreba for ... u petlji
  4. Za ... petlje (implicitna upotreba iteratora)
  5. Eksplicitna upotreba iteratora
• 1. Korištenje metoda za ponavljanje stvarnih nizova
  2. Pretvaranje u pravi niz
  3. Napomena o objektima izvođenja

I. Iteracija preko realnih nizova

Trenutno postoje tri načina za ponavljanje elemenata realnog niza:

1. Metoda Array.prototype.forEach;
2. klasična for petlja;
3. "Dobro oblikovan" za ... u petlji.

Osim toga, uskoro, s pojavom novog standarda ECMAScript 6 (ES 6), očekuju se još dva načina:

1. for ... petlje (implicitna upotreba iteratora);
2. eksplicitna upotreba iteratora.

1. Metoda forEach i povezane metode

Ako je vaš projekt osmišljen tako da podržava mogućnosti standarda ECMAScript 5 (ES5), možete koristiti jednu od njegovih inovacija - metodu forEach.

Primjer upotrebe:
var a = ["a", "b", "c"]; a.forEach (funkcija (unos) (konzola.log (unos);));
Općenito, korištenje forEach zahtijeva povezivanje biblioteke emulacije es5-shim za preglednike koji nemaju izvornu podršku za ovu metodu. To uključuje IE 8 i ranije, koji se i danas koriste.

Prednost forEach-a je u tome što nema potrebe deklarirati lokalne varijable za pohranu indeksa i vrijednosti trenutnog elementa niza, budući da se one automatski prosljeđuju funkciji povratnog poziva kao argumenti.

Ako ste zabrinuti zbog potencijalnih troškova pozivanja povratnog poziva za svaku stavku, ne brinite i pročitajte ovo.

ForEach je dizajniran za ponavljanje svih elemenata niza, ali osim njega ES5 nudi još nekoliko korisnih metoda za ponavljanje svih ili nekih elemenata, plus izvođenje nekih radnji s njima:

• svaki - vraća true ako za svaki element niza povratni poziv vraća vrijednost koja se pretvara u true.
• some - vraća true ako za barem jedan element niza povratni poziv vraća vrijednost koja se pretvara u true.
• filter - stvara novi niz koji uključuje one elemente izvornog niza za koje povratni poziv vraća true.
• map - stvara novi niz koji se sastoji od vrijednosti koje vraća povratni poziv.
• smanjiti - smanjuje niz na jednu vrijednost, primjenjujući povratni poziv naizmjenično na svaki element niza, počevši od prvog (može biti korisno za izračunavanje zbroja elemenata niza i drugih konačnih funkcija).
• reducira pravo - radi slično reduciranju, ali iterira elemente obrnutim redoslijedom.

2. Petlja for

Dobro staro za pravila:

Var a = ["a", "b", "c"]; indeks var; za (indeks = 0; indeks< a.length; ++index) { console.log(a); }
Ako duljina niza ostane nepromijenjena tijekom cijele petlje, a sama petlja pripada dijelu koda koji je kritičan za performanse (što je malo vjerojatno), tada možete koristiti "optimalniju" verziju for sa pohranjivanjem duljine niz:

Var a = ["a", "b", "c"]; indeks var, len; za (indeks = 0, len = a.dužina; indeks< len; ++index) { console.log(a); }
U teoriji, ovaj bi kod trebao raditi nešto brže od prethodnog.

Ako redoslijed iteracije nije važan, možete ići još dalje u smislu optimizacije i riješiti se varijable za pohranjivanje duljine niza promjenom redoslijeda iteracije u suprotan:

Var a = ["a", "b", "c"]; indeks var; za (indeks = a.dužina - 1; indeks> = 0; --index) (console.log (a);)
Međutim, u modernim JavaScript motorima ove optimizirane igre obično ne znače ništa.

3. Ispravna upotreba for ... u petlji

Ako vam se savjetuje korištenje for ... u petlji, zapamtite da ponavljanje nizova nije ono za što je namijenjeno. Suprotno uobičajenoj zabludi, for ... in petlja ne ponavlja indekse niza, već nabrojena svojstva objekta.

Međutim, u nekim slučajevima, kao što je ponavljanje rijetkih nizova, za ... in može biti korisno, pod uvjetom da poduzmete neke mjere opreza, kao što je prikazano u primjeru u nastavku:

// a je rijedak niz var a =; a = "a"; a = "b"; a = "c"; za (var ključ u a) (if (a.hasOwnProperty (ključ) && /^0$|^\d*$/.test(ključ) && ključ<= 4294967294) { console.log(a); } }
U ovom primjeru, pri svakoj iteraciji petlje, izvode se dvije provjere:

1. da niz ima svoje vlastito svojstvo pod nazivom ključ (nije naslijeđeno od svog prototipa).
2. taj ključ je niz koji sadrži decimalni zapis cijelog broja čija je vrijednost manja od 4294967294. Odakle dolazi zadnji broj? Iz definicije indeksa niza u ES5, što implicira da je najveći indeks koji element u nizu može imati (2 ^ 32 - 2) = 4294967294.

Naravno, takve provjere će oduzeti dodatno vrijeme prilikom izvođenja petlje. Ali u slučaju rijetkog niza, ova metoda je učinkovitija od for petlje, budući da se u ovom slučaju ponavljaju samo oni elementi koji su eksplicitno definirani u nizu. Dakle, u gornjem primjeru bit će izvedene samo 3 iteracije (za indekse 0, 10 i 10000) - naspram 10001 u for petlji.

Kako ne biste pisali tako glomazan kod provjera svaki put kada trebate iterirati niz, možete ga dizajnirati kao zasebnu funkciju:

Funkcija arrayHasOwnIndex (niz, ključ) (povratak array.hasOwnProperty (ključ) && /^0$|^\d*$/.test(ključ) && ključ<= 4294967294; }
Tada će se tijelo petlje iz primjera značajno smanjiti:

Za (ključ u a) (if (arrayHasOwnIndex (a, ključ)) (console.log (a);))
Gornji kod provjera je univerzalan, prikladan za sve slučajeve. Ali umjesto toga, možete koristiti kraću verziju, iako formalno nije sasvim ispravna, ali ipak prikladna za većinu slučajeva:

Za (ključ u a) (if (a.hasOwnProperty (ključ) && String (parseInt (ključ, 10)) === ključ) (console.log (a);))

4. For ... petlje (implicitna upotreba iteratora)

ES6, dok je još u statusu nacrta, trebao bi uvesti iteratore u JavaScript.

Iterator je objektno implementiran protokol koji definira standardni način dobivanja niza vrijednosti (konačnih ili beskonačnih).
Iterator je objekt u kojem je definirana metoda next () - funkcija bez argumenata koja vraća objekt s dva svojstva:

1. done (boolean) - istina ako je iterator došao do kraja niza koji se ponavlja. Inače, lažno.
2. vrijednost - definira vrijednost koju vraća iterator. Može biti nedefinirano (odsutno) ako je svojstvo doneto istinito.

Mnogi ugrađeni objekti, uklj. stvarni nizovi imaju zadane iteratore. Najjednostavniji način korištenja iteratora na stvarnim nizovima je korištenje novog za ... konstrukcije.

Primjer korištenja za ... od:

Var val; var a = ["a", "b", "c"]; za (val od a) (console.log (val);)
U gornjem primjeru, for ... of petlja implicitno poziva iterator objekta Array da bi dobio svaku vrijednost u nizu.

5. Eksplicitna upotreba iteratora

Iteratori se također mogu eksplicitno koristiti, međutim, u ovom slučaju kod postaje puno kompliciraniji u usporedbi s for ... petlje. izgleda ovako:

Var a = ["a", "b", "c"]; var it = a.unosi (); var unos; dok (! (entry = it.next ()). done) (console.log (entry.value);)
U ovom primjeru, metoda Array.prototype.entries vraća iterator koji se koristi za prikaz vrijednosti niza. Prilikom svake iteracije, entry.value sadrži niz oblika [ključ, vrijednost].

II. Iteracija preko objekata sličnih nizu

Osim pravih nizova, JavaScript također sadrži objekti nalik nizu ... Ono što im je zajedničko sa stvarnim nizovima je da imaju svojstvo duljine i svojstva s imenima u obliku brojeva koji odgovaraju elementima niza. Primjeri uključuju DOM zbirke NodeList i pseudo-niz argumenata koji su dostupni unutar bilo koje funkcije/metode.

1. Korištenje metoda iteracije preko stvarnih nizova

Barem većina, ako ne i sve, metode ponavljanja stvarnih nizova mogu se koristiti za ponavljanje objekata sličnih nizu.

For i for ... in konstrukcije mogu se primijeniti na objekte slične nizu na potpuno isti način kao i na stvarne nizove.

ForEach i druge metode Array.prototype također se primjenjuju na objekte slične nizu. Da biste to učinili, trebate upotrijebiti poziv Function.call ili Function.apply.

Na primjer, ako želite primijeniti forEach na svojstvo childNodes objekta Node, možete to učiniti ovako:

Array.prototype.forEach.call (node.childNodes, funkcija (dijete) (// učini nešto s podređenim objektom));
Radi lakše ponovne upotrebe ove tehnike, možete deklarirati referencu na metodu Array.prototype.forEach u zasebnoj varijabli i koristiti je kao skraćenicu:

// (Ovo pretpostavlja da je sav kod ispod u istom opsegu) var forEach = Array.prototype.forEach; // ... forEach.call (node.childNodes, funkcija (dijete) (// učini nešto s podređenim objektom));
Ako objekt sličan nizu ima iterator, tada se može koristiti eksplicitno ili implicitno za ponavljanje preko objekta na isti način kao i za stvarne nizove.

2. Pretvorite u pravi niz

Također postoji još jedan, vrlo jednostavan način iteracije preko objekta nalik nizu: pretvorite ga u pravi niz i koristite bilo koju od gore navedenih metoda za ponavljanje preko stvarnih nizova. Za pretvorbu možete koristiti generičku metodu Array.prototype.slice, koja se može primijeniti na bilo koji objekt sličan nizu. To se radi vrlo jednostavno, kao što je prikazano u primjeru ispod:

Var trueArray = Array.prototype.slice.call (arrayLikeObject, 0);
Na primjer, ako želite pretvoriti kolekciju NodeList u pravi niz, potreban vam je kod poput ovoga:

Var divs = Array.prototype.slice.call (document.querySelectorAll ("div"), 0);
ažuriranje: Kao što je navedeno u komentarima