• Prijevod

Većina aplikacija razvijenih ovih dana zahtijeva interakciju s nekom vrstom skupa podataka. Rukovanje elementima u zbirkama uobičajena je operacija s kojom ste se vjerojatno susreli. Kada radite, na primjer, s nizovima, možete bez razmišljanja koristiti običnu 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, izvršiti pretraživanje na njemu, izmijeniti ovaj popis ili njegove elemente. Možda trebate brzo izvesti neke izračune koji uključuju elemente popisa. Recimo, trebate nešto dodati nečemu, nešto pomnožiti nečim. Je li moguće pronaći alate u JavaScriptu koji vam omogućuju brže i praktičnije rješavanje takvih problema od korištenja obične for petlje?

Zapravo, postoje takve mogućnosti u JavaScriptu. O nekima od njih raspravlja se u materijalu čiji prijevod danas predstavljamo vašoj pozornosti. Konkretno, govorimo o operatoru širenja, for...of petlji i metodama include(), some(), every(), filter(), map() i reduce(). Ovdje ćemo uglavnom govoriti o nizovima, ali tehnike o kojima se ovdje govori općenito su prikladne za rad s drugim vrstama objekata.

Treba napomenuti da recenzije moderni pristupi Razvoj JS-a obično uključuje primjere pripremljene pomoću funkcija strelica. Možda ih ne koristite č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 možda jednostavno nisu pravi za vas. Stoga će ovdje u većini situacija biti prikazane dvije opcije za izvođenje istih radnji: korištenje normalne funkcije(ES5) i pomoću funkcija strelica (ES6). Za one koji tek počinju raditi s funkcijama strelica, funkcije strelica nisu ekvivalent deklaracijama funkcija i funkcijskim izrazima. Ne biste trebali zamijeniti jedno s drugim. Konkretno, to je zbog činjenice da u običnim i streličastim funkcijama ključna riječ ovo se ponaša drugačije.

1. Operator ekspanzije

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

▍Snage operatora proširenja

• Jednostavno je i brz način“izvući” njegove pojedinačne elemente iz niza.
• Ovaj je operator prikladan za rad s literalima polja i objekata.
• Ovo je brza i intuitivna metoda rada s argumentima funkcije.
• Operator proširenja ne zauzima puno mjesta u kodu – izgleda kao tri točke (...).

▍Primjer

Recimo da imate zadatak navesti svoje omiljene poslastice bez korištenja petlje. Korištenjem operatora proširenja to se radi ovako:

2. Petlja za...od

Naredba for…of dizajnirana je za prelaženje objekata koji se mogu ponavljati. Omogućuje pristup pojedinačni elementi takve objekte (osobito za niz elemenata), što, na primjer, omogućuje njihovu izmjenu. Može se smatrati zamjenom za uobičajeno za petlju.

▍Snage for...of petlje

• Ovo je jednostavan način dodavanja ili ažuriranja stavki zbirke.
• Petlja for…of omogućuje izvođenje raznih izračuna pomoću elemenata (zbrajanje, množenje itd.).
• Praktičan je za korištenje kada trebate provjeriti bilo kakve uvjete.
• Njegova uporaba dovodi do pisanja čišćeg i čitljivijeg koda.

▍Primjer

Recimo da imate strukturu podataka koja opisuje sadržaj kutije s alatima i želite prikazati te alate. Evo kako to učiniti pomoću for...of petlje:

3. Includes() metoda

Metoda include() koristi se za provjeru je li određeni element prisutan u kolekciji, posebno npr. određena linija u nizu koji sadrži nizove. Ova metoda vraća true ili false ovisno o rezultatima testa. Kada ga koristite, vrijedi uzeti u obzir da je osjetljiv na velika i mala slova. Ako, na primjer, kolekcija sadrži string element SCHOOL, a include() provjerava njegovu prisutnost pomoću string school, metoda će vratiti false.

▍Snage metode include().

• Metoda include() korisna je u stvaranju jednostavnih mehanizama za pronalaženje podataka.
• Programeru daje intuitivan čist način utvrđivanje prisutnosti određenih podataka u nizu.
• Pogodno ga je koristiti u uvjetnim izrazima za modificiranje, filtriranje elemenata i 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 je li određeni automobil u ovoj garaži ili ne. Kako biste riješili ovaj problem, morate napisati kod koji vam omogućuje da provjerite je li automobil u garaži. Upotrijebimo metodu include():

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 njen argument funkcija, a ne, na primjer, uobičajeni niz.

▍Snage metode some().

• Metoda some() omogućuje nam da provjerimo sadrži li niz barem jedan od elemenata koji nas zanimaju.
• Izvodi test uvjeta pomoću funkcije 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. Međutim, nekim posjetiteljima nije dopušten ulazak u klub, jer su skloni prekomjernoj konzumaciji alkoholnih pića, navode barem, u slučaju da se sami nađu u Vašem objektu, a s njima nema nikoga tko bi ih mogao čuvati. U u ovom 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. Every() metoda

Metoda every() ponavlja kroz niz i testira svaki element u odnosu na određeni uvjet, vraćajući true ako svi elementi niza odgovaraju uvjetu, a false u suprotnom. Možete vidjeti da je sličan some() metodi.

▍Snage metode every().

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

▍Primjer

Vratimo se na prethodni primjer. Tamo ste u klub pustili posjetitelje mlađe od 18 godina, no netko je napisao izjavu policiji nakon čega ste se našli u neugodnoj situaciji. Nakon što se sve posložilo, zaključio si da ti sve ovo ne treba i postrožio si 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šavanje problema u dvije verzije, ali ovaj put ćemo koristiti metodu every().

ES5

ES6

6. metoda filter().

Metoda filter() omogućuje vam stvaranje, na temelju niza, novi niz, koji sadrži samo one elemente izvornog niza koji zadovoljavaju zadani uvjet.

▍Snage metode filter().

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

▍Primjer

Pretpostavimo da s popisa cijena trebate odabrati samo one koje su veće ili jednake 30. Upotrijebimo metodu filter() da riješimo ovaj problem.

ES5

ES6

7. Metoda map().

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

▍Snage metode map().

• Metoda map() izbjegava potrebu mijenjanja elemenata izvornog niza.
• Može se koristiti za zgodnu izmjenu elemenata niza.
• Poboljšava čitljivost koda.

▍Primjer

Recimo da imate popis proizvoda s cijenama. Vaš upravitelj treba novi popis robu čije su cijene snižene 25%. Upotrijebimo metodu map() da riješimo ovaj problem.

ES5

ES6

8. metoda reduce().

Metoda reduce(), u svom najjednostavnijem obliku, omogućuje zbrajanje elemenata numerički nizovi. Drugim riječima, reducira niz na jednu vrijednost. To vam omogućuje da ga koristite za izvođenje raznih izračuna.

▍Snage metode reduce().

• Pomoću metode reduce() možete izračunati zbroj ili prosjek elemenata niza.
• Ova metoda ubrzava i pojednostavljuje izračune.

▍Primjer

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

ES5

ES6

Dodaj oznake

U ovom ćemo članku pogledati JavaScript polje i njegove komponente. JavaScript je idealno dizajniran za programiranje. Zapravo, implementira ECMAScript jezik (ECMA-262 standard).

Gdje se koristi JavaScript? Koristi se kao ugrađeni jezik za definiranje softverski put predmetu prijave. Može se pronaći u preglednicima gdje se koristi kao skriptni jezik koji web stranice čini interaktivnima.

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

Općenito, JavaScript je bio pod utjecajem različiti razlozi, jer su tijekom razvoja željeli stvoriti jezik sličan Javi, ali jednostavan za korištenje programerima. Usput, jezik JavaScript nije u vlasništvu nijedne tvrtke ili organizacije, što ga čini drugačijim od brojnih stilova programiranja koje koriste web programeri.

Treba napomenuti da je JavaScript registriran zaštitni znak koncerna Oracle Corporation.

Što je niz?

Niz je onaj koji pohranjuje numerirane vrijednosti. Svaka takva vrijednost naziva se komponenta polja, a znamenka kojoj je komponenta pridružena naziva se indeks. JavaScript niz nije tipiziran. To znači da dijelovi niza mogu biti bilo kojeg tipa, a različiti dijelovi koji pripadaju istom nizu imaju potpuno različite tipove.

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

Proizvodnja polja

Korištenjem JavaScripta stvaranje niza uopće nije teško. Za to postoje dvije metode. Prvi uključuje stvaranje niza pomoću literala - uglatih zagrada, unutar kojih je popis dijelova, odvojenih zarezima.

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

Tipično, vrijednosti ovdje ne moraju biti jednostavne (nizovi i brojevi). To također mogu biti bilo koji drugi izrazi, na primjer, predmetni literali, druge funkcije i nizovi.

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

• Pozivanje dizajnera bez argumenata: var b - new Array(). Ovo omogućuje stvaranje praznog niza, ekvivalentnog praznom literalu.
• Konstruktor eksplicitno navodi vrijednost n komponenti niza: var b = novi niz (1, 3, 5, 8, “niz”, istina). U ovom slučaju, dizajneru se prezentira popis argumenata koji se pretvaraju u komponente novog niza. Argumenti se zapisuju u polje na mjestu na kojem su navedeni.
• Definiranje područja za naknadno dodjeljivanje vrijednosti. To se postiže određivanjem, prilikom identificiranja niza, jednog broja u zagradama: var b = new Array(5). Ova metoda identifikacija uključuje dodjeljivanje potrebnog broja komponenti nizu (od kojih je svaka navedena kao nedefinirana) uz mogućnost naknadnog dodjeljivanja vrijednosti tijekom procesa prezentacije. Ovaj se obrazac obično koristi za unaprijed dodjelu Javascript niza čija je duljina unaprijed poznata.

Pisanje, čitanje i dodavanje detalja niza

Komponentama niza možete pristupiti pomoću operatora. Usput, sve komponente u JavaScriptu, počevši od nule, su numerirane. Za dobivanje potreban element, njegov broj je naveden u U pravilu se detalji mogu mijenjati. A da biste nizu dodali JavaScript, samo trebate dodijeliti novu vrijednost.

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

Duljina niza

Dakle, znamo da je duljina niza općenito zanimljiv fenomen. Pogledajmo ga pobliže. Svi nizovi, bilo da su konstruirani korištenjem Array() dizajnera ili otkriveni kroz literal polja, imaju specifično svojstvo duljine koje označava ukupni broj pohranjenih elemenata. Budući da niz može sadržavati nedefinirane dijelove (označene s undefined), precizniji izraz je: kvaliteta duljine uvijek je za jedan veća od najviše velika soba(indeks) komponente polja. Kvaliteta duljine podešava se automatski, ostajući točna kada se novi dijelovi pojave u nizu.

Kako bi se prikazala konačna komponenta niza, možete koristiti svojstvo length.

Posljednji dio ima indeks jedan manji od veličine polja. Uostalom, odbrojavanje uvijek počinje od nule. Oh, ovaj JavaScript! Duljina niza ovisi o točnom broju elemenata. Dakle, ako ne znate koliko bi ih trebalo biti, ali trebate pristupiti konačnom elementu niza, trebate koristiti oznaku: v.length - 1.

Ponavljanje detalja niza

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

• var voće = [“jagoda”, “breskva”, “jabuka”, “banana”];
• for(var I = 0; i< fruits.lenght; i++);
• document.write(fruits[i] + "...").

U ovom primjeru čini se da su komponente postavljene kontinuirano i počinju s prvim dijelom koji ima indeks nula. 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.

Povećajte i skraćite niz

Pitam se kako koristiti jezik JavaScript niz dodati u niz? Kako radimo s nizovima, kvalitetna duljina se automatski poboljšava, zbog čega se sami moramo pobrinuti za to. Potrebno je zapamtiti jedan detalj - svojstvo length nije samo čitljivo, već i pisalo. Ako je kvaliteti duljine dodijeljena vrijednost koja je manja u veličini od trenutne, tada se polje smanjuje na navedenu veličinu. Sve komponente koje nisu u novom rasponu indeksa odbacuju se i njihove se vrijednosti gube, čak i ako se kasnije vrati duljina - vrijednosti se ne vraćaju.

Prilično je lako očistiti niz ovako: foo.length = 0.

Ako je kvaliteta duljine veća od trenutne vrijednosti, novi neidentificirani dijelovi pojavit će se na kraju niza, što će ga povećati na željenu veličinu.

Uklanjanje dijelova uzorka

Operator brisanja navodi nedefiniranu vrijednost u komponenti polja, ali ona nastavlja postojati. Ako trebate ukloniti element JavaScript niza kako bi se preostali dijelovi premjestili u slobodni prostor, trebate upotrijebiti jednu od ponuđenih metoda niza. Metoda Array.shift() eliminira prvu komponentu, pop() eliminira konačnu komponentu, a metoda splice() eliminira jednu ili niz komponenti bilo gdje u nizu.

Višedimenzionalni nizovi

Čini se da smo malo sredili stvari Dvodimenzionalni nizovi- to je ono što treba razmotriti sljedeće. Sjećate li se da JavaScript nizovi mogu sadržavati druge elemente kao komponente? Ova se značajka koristi za proizvodnju višedimenzionalni nizovi. Da biste posjetili komponente u nizu nizova, jednostavno dvaput upotrijebite uglate zagrade.

Asocijativni nizovi

Sada proučimo kako zaštitni znak JavaScript asocijativni koristi nizove. Da bismo to učinili, moramo proučiti teoriju: asocijativne nizove ponekad nazivamo hash tablicama. Zahvaljujući njima umjesto indeksa koriste se stringovi. Korištenje takvih konstrukcija slično je korištenju naziva svojstva jednostavan objekt, ali u ovu opciju pri izvođenju rada u formatu polja. Budući da JavaScriptu nedostaju načini za rad s asocijativnim nizovima, oni se koriste puno rjeđe od običnih. Valja napomenuti da oni i dalje mogu biti korisni za pohranjivanje podataka i olakšavaju pamćenje detalja kojima je potrebno pristupiti.

Izlaz polja

Što ćemo sada naučiti o JavaScriptu? Prikaz niza u dijaloškom okviru (na ekranu monitora), kao i prikaz vrijednosti komponenti niza.

Ako trebate prikazati vrijednosti svih komponenti u programu, onda je zgodno koristiti naredbu for. Zanimljivo je da se varijabla brojača for rules koristi kao indeks komponente polja.

Čišćenje

U cilju filtriranja JavaScript polje, trebate resetirati njegovu duljinu:

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

• jasno: funkcija() (;
• this.length = 0;
• vrati ovo;

Dodavanje i uklanjanje komponenti

Pa, nastavimo dalje proučavati ovo. najzanimljiviji jezik JavaScript. Element niza može se izbrisati ili dodati na isti način kao i regularna svojstva drugih objekata. Ali tu postoje neke razlike: kod dodavanja numerička svojstva kvaliteta duljine se može promijeniti, a kada se mijenja svojstvo duljine, brojčane kvalitete mogu se eliminirati. U principu, algoritam za postavljanje kvaliteta za nizove je sljedeći:

• Prilikom dodavanja nepoznatog digitalnog svojstva i, ako je duljina jednaka ili manja od i, duljina se definira kao i+1.
• Kad kvaliteta promijeni duljinu, sljedeće radnje: ako je dodijeljena vrijednost manja od nule, tada se javlja RangeError. Eliminiraju se sve numeričke kvalitete i indeksi koji su jednaki novoj duljini i koji su veći.

Općenito, brisanje elementa JavaScript polja nije teško. Uostalom, čak i kada postavljate duljinu, morate ukloniti "dodatne" komponente iz nje. To dovodi do opcije brisanja niza. Ako iz nekog razloga dodijeljena varijabla praznog novog niza nije zadovoljavajuća, te je potrebno resetirati trenutni, dovoljno je kvaliteti njegove duljine dodijeliti vrijednost nula.

metode unshift, shift, pop i push

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

Push metoda pomiče proslijeđene dijelove na kraj niza. Pop metoda vraća zaostalu komponentu i uklanja je.

Općenito u Internet Explorer ranije od osme verzije, unshift može vratiti nedefinirano; u drugim preglednicima, novu vrijednost duljine. Stoga je bolje ne oslanjati se na vrijednost vraćenu od unshift-a.

Dodavanje i uklanjanje dijelova u sredini niza

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

Uklanja komponente deleteCount iz niza, počevši od indikatora početka. Ako se proslijedi više od dva argumenta, tada se svi sljedeći argumenti u nizu postavljaju umjesto eliminiranih. Ako je početak negativan, tada će indeks od kojeg će se povlačenje nastaviti biti jednak duljini + početak. Niz se vraća iz uklonjenih elemenata.

Zapravo, koristeći metoda spajanja, možete ukloniti komponente iz sredine niza ili dodati bilo koji broj na bilo koje mjesto u nizu.

U najjednostavnijoj verziji, ako trebate ukloniti komponentu s indeksom i, trebate zatražiti metodu spajanja iz niza s parametrima i i 1.

U načelu, drugi parametar metode spajanja nije obavezan, ali ponašanje funkcije s jednim argumentom razlikuje se u svakom pregledniku.

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

Nijedna komponenta neće biti eliminirana u IE. U prvim varijantama Opere nemoguće je predvidjeti ponašanje - jedan dio s početkom indeksa - 1 bit će uklonjen. Stoga je uvijek potrebno ovu metodu prolaze najmanje dvije komponente.

Ključevi

Naravno, prilikom učenja JavaScripta, asocijativne nizove, kao što je ranije spomenuto, također treba imati na umu. Ovo je apstraktna vrsta informacija (sučelje za pohranu podataka), koja vam omogućuje spremanje parova u obliku "(ključ, vrijednost)" i podržava operacije dodavanja para, kao i brisanja i traženja para po ključu:

NAĆI (ključ).

INSERT (vrijednost, ključ).

UKLONITI (ključ).

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

Dakle, radnja FIND (ključ) vraća vrijednost pridruženu danom ključu ili neki specifični UNDEF objekt koji pokazuje da ne postoji vrijednost pridružena danom ključu. Druge dvije akcije ne vraćaju ništa (osim da li je operacija bila uspješna).

Općenito, s gledišta sučelja, prikladno je asocijativno polje smatrati jednostavnim poljem 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 interpretacijama programski jezici visoka razina, 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 asocijativni niz može poslužiti telefonski imenik. U ovoj verziji značenje je kompleks „F. I. O. + adresa”, a ključ je broj telefona. Jedan broj telefona ima jednog vlasnika, ali jedna osoba može posjedovati više brojeva.

Asocijativna proširenja

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

• EACH - “proći” kroz sve spremljene parove.
• CLEAR - ukloniti sve zapise.
• MIN - pronađite par s najmanjom vrijednošću ključa.
• MAX - pronađite par s najvećom vrijednošću ključa.

Posljednje dvije opcije zahtijevaju da tipke označavaju radnju usporedbe.

Implementacije asocijativnih nizova

Ima ih mnogo različite implementacije asocijativni niz. Najčešća implementacija mogla bi se temeljiti na jednostavan niz, čije su komponente (vrijednost, ključ) parovi. Da biste ubrzali radnje pretraživanja, možete organizirati komponente ovog niza po ključu i pronađi koristeći Ali to će povećati vrijeme potrebno za dodavanje novog para, budući da će biti potrebno "razdvojiti" komponente niza kako bi se novi zapis upakirao u praznu ćeliju koja se pojavi.

Najpoznatije implementacije su one temeljene na različitim stablima pretraživanja. Na primjer, u tipičnom C++ STL čitaču, spremnik karte implementiran je na temelju stabla crnog mahagonija. Ruby, Tcl, Python stilovi koriste jednu vrstu hash tablice. Postoje i druge implementacije.

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

Poznato je da implementacije temeljene na hash tablici imaju prosječno vrijeme od O(1), što je bolje od implementacija temeljenih na stablu pretraživanja. Naravno, to ne jamči brzu izvedbu pojedinačnih operacija: najgore vrijeme INSERT-a označeno je kao O(n). INSERT proces u tijeku Dugo vrijeme, kada faktor popunjenosti dosegne svoju najvišu točku i postane potrebno rekonstruirati indeks hash tablice.

Usput, ovi hash popisi su loši jer se ne mogu koristiti za brzo izvršavanje dodatne akcije MAX, MIN i algoritam za prolazak kroz sve spremljene parove u silaznom ili uzlaznom redoslijedu ključeva.

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

U ovom ćemo članku pogledati tri malo poznate tehnike koje se mogu koristiti pri radu s nizovima.

1. Dodavanje prilagođenih svojstava nizovima

Ako koristite pretraživanje da pronađete definiciju niza unutar JavaScript jezik, onda će većina izvora to tvrditi ovaj tip Vrijednost varijable je predstavljena kao objekt.

Općenito govoreći, mnoge stvari s kojima se susrećemo u JavaScriptu su objekti. Bilo bi pošteno napomenuti da jezik također sadrži "primitivne" tipove podataka, ali se njihove vrijednosti nekako koriste u svojstvima unutar objekata.

2. Pristup elementima niza unutar petlje

Budući da indeksi polja mogu imati samo pozitivne vrijednosti, brojanje počinje od nule. Kasnije možemo koristiti ovaj indeks za pristup elementu niza u određenoj iteraciji petlje.

ECMAScript6 uveo je način za pomicanje nizom bez korištenja indeksa, već kroz novu for…of petlju.

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

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

3. Broj elemenata nije dimenzija niza

Kada govorimo o veličini niza, obično o tome razmišljamo kao o broju 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 to provjerili, samo pogledajte sljedeće manipulacije:

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

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

Var ary = ; ary.length = 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 array niz "sparse".

Također možemo manipulirati svojstvom duljine kako bismo skraćivali nizove. Primjer ispod pokazuje "gubljenje" elementa na indeksu 5 smanjenjem svojstva duljine niza ary.

Var ary = ; ary.length = 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

• Prijevod

• I. Ponavljanje preko realnih nizova
  1. forEach metoda i srodne metode
  2. za petlju
  3. Ispravna uporaba za...u petlji
  4. for...of petlja (implicitna upotreba iteratora)
  5. Eksplicitna uporaba iteratora
• 1. Korištenje metoda za ponavljanje stvarnih nizova
  2. Pretvori u pravi niz
  3. Napomena o objektima vremena izvođenja

I. Ponavljanje preko realnih nizova

Na ovaj trenutak Postoje tri načina za ponavljanje elemenata stvarnog niza:

1. metoda Array.prototype.forEach ;
2. klasična for petlja
3. "ispravno" konstruirana for...in petlja.

Osim toga, uskoro, s dolaskom novog standarda ECMAScript 6 (ES 6), očekuju se još dvije metode:

1. for...of petlja (implicitna upotreba iteratora);
2. eksplicitna uporaba iteratora.

1. Metoda forEach i srodne metode

Ako je vaš projekt dizajniran da podržava značajke 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 izvorna podrška ovu metodu. To uključuje IE 8 i novije verzije rane verzije, koji su još tu i tamo u upotrebi.

Prednost forEach je u tome što nema potrebe za deklariranjem lokalnih varijabli za pohranjivanje indeksa i vrijednosti trenutnog elementa niza, jer se oni automatski prosljeđuju funkciji povratnog poziva kao argumenti.

Ako ste zabrinuti zbog mogućih troškova povratnog poziva za svaki element, ne brinite i pročitajte ovo.

ForEach je dizajniran za iteraciju kroz sve elemente niza, ali osim toga, ES5 nudi još nekoliko korisnih metoda za iteraciju kroz sve ili neke elemente plus izvođenje nekih radnji na njima:

• svaki - vraća istinito ako za svaki element niza povratni poziv vraća vrijednost koja se može pretvoriti u istinito .
• some - vraća true ako za barem jedan element niza povratni poziv vraća vrijednost koja se može pretvoriti 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 vraćenih povratnim pozivom.
• smanji - reducira niz na jednu vrijednost, primjenjujući povratni poziv na svaki element niza redom, počevši od prvog (može biti korisno za izračun zbroja elemenata niza i druge funkcije sažetka).
• reduceRight - radi slično kao reduce, ali ponavlja elemente obrnutim redoslijedom.

2. Za petlju

Dobro staro za pravila:

Var a = ["a", "b", "c"]; var indeks; za (indeks = 0; indeks< a.length; ++index) { console.log(a); }
Ako je duljina niza konstantna kroz petlju, a sama petlja pripada odjeljku koda koji je kritičan za performanse (što je malo vjerojatno), tada možete koristiti "optimalniji" verzija za sa pohranjivanjem duljine niza:

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

Ako redoslijed elemenata nije bitan, onda možete ići i dalje u smislu optimizacije i riješiti se varijable za pohranjivanje duljine niza, mijenjajući redoslijed pretraživanja obrnutim:

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

3. Ispravna uporaba petlje for...in

Ako vam se savjetuje da koristite for...in petlju, zapamtite da ponavljanje nizova nije ono za što je namijenjeno. Suprotno uobičajenom pogrešnom shvaćanju, petlja for...in ne ponavlja preko indeksa niza, već radije kroz nabrojiva svojstva objekta.

Međutim, u nekim slučajevima, kao što je ponavljanje preko rijetkih nizova, for...in može biti korisno, sve dok poduzmete mjere opreza, kao što je prikazano u primjeru ispod:

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

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

Naravno, takve će provjere oduzeti nepotrebno 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, izvršit će se samo 3 iteracije (za indekse 0, 10 i 10000) - naspram 10001 u for petlji.

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

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

Za (unesite a) ( if (arrayHasOwnIndex(a, ključ)) ( console.log(a); ) )
Gore razmotreni kontrolni kod je univerzalan, prikladan za sve slučajeve. No umjesto toga možete koristiti kraću verziju, iako formalno ne sasvim ispravnu, ali ipak prikladnu za većinu slučajeva:

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

4. For...of petlja (implicitna upotreba iteratora)

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

Iterator je protokol koji implementira objekt koji definira standardni način za dobivanje niza vrijednosti (konačnih ili beskonačnih).
Iterator je objekt koji definira next() metodu - funkciju bez argumenata koja vraća objekt s dva svojstva:

1. gotovo (boolean) - istinito ako je iterator došao do kraja niza koji se može ponoviti. Inače je vrijednost lažna.
2. vrijednost - definira vrijednost koju vraća iterator. Može biti nedefinirano (nedostaje) ako je svojstvo done istinito.

Mnogi ugrađeni objekti, uklj. pravi nizovi imaju iteratore prema zadanim postavkama. Najjednostavniji način korištenja iteratora na stvarnim nizovima je korištenje konstrukcije new for...of.

Primjer korištenja za...od:

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

5. Eksplicitna uporaba iteratora

Iteratori se također mogu koristiti eksplicitno, međutim, u ovom slučaju kod postaje mnogo kompliciraniji u usporedbi s for...of petljom. Izgleda otprilike ovako:

Var a = ["a", "b", "c"]; var it = a.entries(); unos var; while (!(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. U svakoj iteraciji, entry.value sadrži polje u obliku [ključ, vrijednost] .

II. Ponavljanje preko objekata sličnih nizu

Osim pravih nizova, u JavaScriptu postoje i objekti nalik na niz . Ono što im je zajedničko sa stvarnim nizovima je da imaju svojstvo duljine i svojstva imenovana kao brojevi koji odgovaraju elementima niza. Primjeri uključuju DOM kolekcije NodeList i pseudoniz argumenata, dostupan unutar bilo koje funkcije/metode.

1. Korištenje metoda za ponavljanje stvarnih nizova

U najmanju ruku, većina, ako ne i sve, metode iteracije preko stvarnih nizova mogu se koristiti za iteraciju preko objekata sličnih nizovima.

For i for...in konstrukcije mogu se primijeniti na objekte slične nizovima na potpuno isti način kao što se primjenjuju na stvarne nizove.

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

Na primjer, ako želite primijeniti forEach na svojstvo childNodes objekta Node, učinili biste to ovako:

Array.prototype.forEach.call(node.childNodes, function(child) ( // učiniti nešto s objektom dijete));
Kako bi ovaj trik bio lakši za ponovno korištenje, možete deklarirati referencu na metodu Array.prototype.forEach u zasebnoj varijabli i koristiti je kao prečac:

// (pod pretpostavkom da je sav kod ispod u istom opsegu) var forEach = Array.prototype.forEach; // ... forEach.call(node.childNodes, function(child) ( // učiniti nešto s objektom dijete));
Ako objekt sličan nizu ima iterator, on se može koristiti eksplicitno ili implicitno za iteraciju preko objekta na isti način kao za stvarne nizove.

2. Pretvorite u pravi niz

Također postoji još jedan, vrlo jednostavan način za iteraciju preko objekta nalik nizu: pretvorite ga u pravi niz i koristite bilo koju od gore spomenutih metoda za iteraciju 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 u nastavku:

Var trueArray = Array.prototype.slice.call(arrayLikeObject, 0);
Na primjer, ako želite konvertirati kolekciju NodeList u stvarni niz, trebao bi vam kod otprilike ovaj:

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

Naučimo kako indeksirati nizove u js-u, uklanjati i dodavati njihove elemente.

Niz u JavaScriptu je globalni objekt dizajniran za pohranu popisa vrijednosti.

Slična je drugim varijablama po tome što može pohraniti bilo koju vrstu podataka. Ali niz ima jednu važnu razliku od varijable: može pohraniti više od jednog elementa odjednom.

Niz je uređena zbirka vrijednosti. Svaka vrijednost se naziva element i ima svoj broj koji se naziva indeks.

Element unutar niza može biti bilo koje vrste. Štoviše, elementi jednog niza mogu biti različitih vrsta: brojevi, nizovi, logički elementi, pa čak i objekti ili drugi nizovi.

Redoslijed elemenata niza počinje od 0. Ispada da će niz uvijek imati pomak indeksa za jedan: prvi element će imati indeks 0, drugi 1, itd.

Evo primjera niza s elementima različitih vrsta:

Kreiranje (deklariranje) niza

Nizovi su vrlo prikladni jer mogu pohraniti onoliko podataka koliko vam je potrebno. Najveća moguća veličina js niza je 2 32 elementa.

Moramo reći JavaScriptu da želimo stvoriti niz. Za to postoje dvije mogućnosti: vrijednost u uglatim zagradama ili nova ključna riječ.

Kratki zapis: korištenje uglatih zagrada

Popis vrijednosti odvojenih zarezima u uglatim zagradama.

var myArray = [ "Jack", "Sawyer", "John", "Desmond" ];

Sadržaj niza određen je onim što se nalazi između uglatih zagrada. Svaka vrijednost je odvojena zarezom.

Vrijednosti se specificiraju na isti način kao i jednostavne varijable, odnosno nizovi se moraju deklarirati unutar navodnika, itd.

Da biste deklarirali prazan niz, ostavite prazne zagrade:

var myArray = ;

Dugi unos: korištenje konstruktora Array().

var lostArray = new Array("Jack", "Sawyer", "John", "Desmond"); var twinPeaksArray = new Array("Laura", 2, ["Bob", "Leland", "Dale"]);

Nova ključna riječ govori JavaScriptu da stvori novi niz čije se vrijednosti prosljeđuju kao parametri.

Ako unaprijed znate koliko će elemenata biti u vašem nizu, možete odmah proslijediti ovu vrijednost u konstruktor.

var myArray = new Array(80);

Gornji izraz će stvoriti prazan niz koji se sastoji od 80 utora s nedefiniranim vrijednostima.

Deklaracija praznog niza:

var myArray = new Array();

Pristup elementima polja

Koristeći indeks svakog elementa, možete raditi s bilo kojim podacima u nizu, pristupajući im pomoću operatora:

var myArray = ["Jack", "Sawyer", "John", "Desmond"]; console.log(myArray); // Ispisuje “Jack” console.log(myArray); // Ispisuje "Desmond"

Niz može imati nekoliko razina, odnosno svaki element može sam biti niz. Rezultat će biti dvodimenzionalni js niz. Kako možemo pristupiti tim nizovima koji se nalaze unutar drugih - “ višedimenzionalni nizovi»?

Kao primjer, razmotrimo niz koji predstavlja obitelj. Djeca iz ove obitelji bilježe se u zasebnom nizu unutar glavnog:

var familyArray = ["Marge", "Homer", ["Bart", "Lisa", "Maggie"]];

Možete to zamisliti ovako:

Za upućivanje na vrijednost "Lisa":

var lisa = obiteljski niz; konzola.log(lisa); // prikazuje "Lisa"

To se može nastaviti gotovo beskonačno, što vam omogućuje pohranjivanje ugniježđenih skupova podataka u nizove i pristup njima pomoću indeksa.

Dodavanje elemenata nizu

Shvatili smo kako pristupiti elementima niza pomoću njihovih odgovarajućih indeksa. Na sličan način možete dodati (ili promijeniti) elemente deklaracijom, na primjer:

var myArray = ["Kate", "Sun"]; myArray = "Julija"; console.log(myArray); // Ispisuje "Kate, Sun, Juliet"

Što se događa ako deklariram element s indeksom koji nema drugih elemenata prije sebe? Niz će sam kreirati sve elemente koji nedostaju i dodijeliti im nedefiniranu vrijednost:

var myArray = ["Kate", "Sun"]; myArray = "Julija"; console.log(myArray.length); // Ispisuje "6" console.log(myArray); // Ispisuje ["Kate", "Sung", nedefinirano, nedefinirano, nedefinirano, "Juliet"]

Možete saznati koja je duljina js niza korištenjem svojstva length. U gornjem primjeru postoji šest elemenata u nizu, a tri od njih nemaju vrijednost - označeni su kao nedefinirani.

metoda push().

Pomoću metode push() možete dodati jedan ili više elemenata u js polje. Push() prihvaća neograničen broj parametara, a svi će biti dodani na kraj niza.

var myArray = ["Kate", "Sut"]; myArray.push("Julija"); // Dodaje element "Juliet" na kraj niza myArray.push("Libby", "Shannon"); // Dodaje elemente "Libby" i "Shannon" na kraj niza console.log(myaArray ); // Ispisuje ["Kate", "Uskoro", "Juliet", "Libby", "Shannon"]

metoda unshift().

Metoda unshift() radi isto kao push(), osim što dodaje elemente na početak niza.

var myArray = ["Kate", "Sun"]; myArray.unshift("Juliet"); // Dodaje element "Juliet" na početak niza myArray.unshift("Libby", "Shannon"); // Dodaje elemente "Libby" i "Shannon" na početak niza console.log(myArray); // Izlazi ["Libby", "Shannon", "Juliet", "Kate", "Uskoro"]

Uklanjanje elemenata niza

metode pop() i shift().

Metode pop() i shift() uklanjaju zadnji odnosno prvi element niza:

var myArray = ["Jack", "Sawyer", "John", "Desmond", "Kate"]; moj niz.pop(); // Uklanja element "Kate" myArray.shift(); // Uklanja element "Jack" console.log(myArray); // Ispisuje ["Sawyer", "John", "Desmond"]

splice() metoda

Pomoću metode splice() možete uklanjati ili dodavati elemente nizu, uz točno određivanje indeksa elemenata.

U sljedećem primjeru, metoda splice() dodaje dva elementa počevši od indeksa 2 ( odnosno od trećeg elementa):

var fruitArray = ["jabuka", "breskva", "naranča", "limun", "limeta", "trešnja"]; fruitArray.splice(2, 0, "dinja", "banana"); console.log(fruitArray); // Izlazi ["jabuka", "breskva", "dinja", "banana", "naranča", "limun", "limeta", "trešnja"]

Prvi parametar metode splice() je indeks. Označava na kojem položaju elemente treba dodati/ukloniti. U našem primjeru odabrali smo indeks 2 ( što znači "narančasto").

Drugi parametar je broj elemenata koje je potrebno ukloniti. Naveli smo vrijednost 0, tako da ništa neće biti izbrisano.

Sljedeći parametri nisu obavezni. Oni dodaju nove vrijednosti nizu. U našem slučaju, moramo dodati "dinju" i "bananu", počevši od indeksa 2.