JS silmusõpetuse jaoks - kuidas Java-s massiivi ületada

See artikkel annab teile põhjaliku ülevaate sellest, kuidas JavaScripti massiivi andmestruktuuri üle korrata.

Ükskõik, kas olete alles hakanud JavaScripti õppima või olete siin värskenduseks, on teie jaoks väärtus mõlemal juhul. Selles artiklis tutvustatakse üht kõige enam kasutatavat JavaScripti mõistet.

Mis on massiiv?

let cars = ["Tesla", "Ferrari", "Lamborghini", "Audi"];

Eespool on JavaScripti massiiv, mida kasutatakse mitme väärtuse salvestamiseks. See on massiivi üks lihtsamaid vorme. See sisaldab massiivi sees 4 "elementi", kõik stringid. Ja nagu näete, eraldatakse kõik elemendid komaga.

See massiivi näide sisaldab erinevaid automarke ja sellele saab viidata carsmuutujaga.

Selle massiivi kordamiseks on mitmeid viise. JavaScript on uskumatult funktsioonirikas, seega on meil luksus valida probleemide lahendamiseks parim viis.

Siit saate teada, kuidas lahendada JavaScripti massiivide kordamine:

  1. Tõstke esile 5 levinud meetodit massiivi kordamiseks
  2. Näidake mõnda iteratiivset meetodit
  3. Esitage ka kood, mida saate selle testimiseks kasutada!

Traditsiooniline silmuse jaoks

Mis on aas?

Vikipeedia määratleb aasa jaoks järgmiselt:

"In infotehnoloogia, et for-loop (või lihtsalt silmus ) on kontrolli voolu väljavõte täpsustades iteratsiooni, mis võimaldab koodi täidetakse korduvalt."

A for loop on viis koodi korduvaks täitmiseks. Selle asemel, et console.log(“hi”)viis korda välja kirjutada , võiksite selle keerata for a loop-i.

Selles esimeses näites õpime, kuidas ülaltoodud autode massiivi korrata ja kõik elemendid välja printida. Kordaja ehk loendur algab esimesest indeksist “Tesla” ja lõpeb viimasest “Audist”. See liigub massiivi kaudu ja prindib ühe elemendi korraga.

let cars = ["Tesla", "Ferrari", "Lamborghini", "Audi"]; for(let i = 0; i < cars.length; i++) { console.log(cars[i]); }

Väljund:

Tesla Ferrari Lamborghini Audi

Koodisse sukeldudes edastame for loop'ile kolm võimalust

  • iteraatori muutuja - let i = 0;
  • kus iteraator peaks peatuma - i < card.length
  • kui palju iga tsükli kordajat suurendada - i++

See silmus algab meist 0, suurendab muutujat ühe silmuse võrra ühe võrra ja peatub, kui tabame massiivi viimast elementi.

Traditsioonilise loopi jaoks on peamine eelis see, et teil on suurem kontroll.

Keerulise probleemi lahendamiseks on võimalik massiivi erinevatele elementidele juurde pääseda või massiivi kaudu keerukal viisil itereerida. Näiteks saab massiivi iga teise elemendi vahele jätta traditsioonilise loopi jaoks.

ForEach meetod

Mis on iga meetod?

forEachMeetodit kasutatakse käivitate funktsiooni iga element oma massiivi. See meetod on suurepärane valik, kui massiivi pikkus on "teadmata" või kui see on tagatud. Seda meetodit saab kasutada ainult massiivide, komplektide ja kaartide puhul.

const amounts = [65, 44, 12, 4]; let doubledAmounts = []; amounts.forEach(item => { doubledAmounts.push(item * 2); }) console.log(doubledAmounts);

Tsükli suurim eelis forEachon juurdepääs igale üksusele, isegi kui teie massiivi suurus tõenäoliselt kasvab. See on skaleeritav lahendus paljude kasutusjuhtumite jaoks ning seda on lihtsam lugeda ja mõista kui tavapärast loopi jaoks, sest teame, et kordame iga elemendi üle täpselt ühe korra.

Kuigi silmus

Mis on samas aas?

Vikipeedia määratleb samal ajal kui silmus:

While-tsükkel on juhtimisvoogude lause, mis võimaldab koodi korduvalt käivitada antud Boole'i ​​tingimuse alusel. Samas loop võib vaadelda kui korrates kui avaldus.

whileLoop on viis tee koodi korduvalt kontrollida, kas tingimus on tõene või väär. Niisiis, selle asemel, et kasutada loopi for for sisestatud if-lausega, võime kasutada while-silmust. Või kui me ei leia massiivi pikkust, siis on silmused suurepärane valik.

While-silmust kontrollib sageli loendur. Allpool toodud näites näitame massiivi kaudu iteratsiooni põhisilmusena. Peamine on kontrollida loodava loopi üle.

Kuigi silmuse näide (hea):

let i = 0 while (i < 5) { console.log(i); i++; }

Väljund :

0 1 2 3 4

While-lause on juhul i < 5, kui lause on või öeldud valjusti, "i on väiksem kui 5". Muutujat isuurendatakse iga kord, kui silmus töötab.

Lihtsamalt öeldes tähendab see seda, et muutujale lisatakse iiga kord, kui silmus täidab täieliku iteratsiooni. Esimesel iteratsioonil ivõrdub 0 ja trükime konsoolile “0”.

Suurim risk mõnda aega kasutada on tingimuse kirjutamine, mis pole kunagi täidetud.

See juhtub sageli reaalsetes stsenaariumides, kus keegi kirjutab mingi aja, kuid unustab oma tsükli testida ja see viib koodibaasi lõpmatu tsükli.

Lõputu tsükkel tekib siis, kui tingimus pole kunagi täidetud, ja silmus töötab igavesti. Selle tulemuseks on sageli muutuvad muudatused, mis põhjustavad kogu tarkvararakenduse katkemise ja töötamise.

Hoiatus. Ärge käivitage seda koodi.

Lõputu tsükli näide (halb):

let i = 0 while (i < 5) { console.log(i); }

Väljund:

Tulemused võivad erineda.

Tehke silmust

Mis on tsükkel do while?

Vikipeedia määratleb Do-While tsükli järgmiselt:

" Do while loop on juhtimisvoogude lause, mis käivitab koodiploki vähemalt üks kord ja seejärel täidab ploki korduvalt või mitte, sõltuvalt antud boolean-tingimusest ploki lõpus."

Do-while silmus on peaaegu identne while-silmusega, kuid sellel on üks oluline erinevus. Do-while tsükkel garanteerib koodiploki alati vähemalt korra enne if-lause kontrollimist.

Ma arvan, et see on vastupidine silmus ja ma ei kasuta neid peaaegu kunagi. Mõnes väga spetsiifilises stsenaariumis tulevad need siiski kasuks.

Do-Loop näide (hea):

let i = 0; do { console.log(i); i++; } while (i < 5);

Väljund :

0 1 2 3 4

Suurim risk do-loopi kasutamisel on tingimuse kirjutamine, mis pole kunagi täidetud. (Sama mis samasuguse aasaga.)

Hoiatus. Ärge käivitage seda koodi.

Lõputu tsükli näide (halb):

let i = 0; do { console.log(i); } while (i < 5);

Väljund :

Tulemused võivad erineda.

Kas soovite oma JavaScripti teadmised uuele tasemele viia? Siit saate teada map, mis on sama mis forEachboonusega !! ?

BONUS-näide (kordamine kaardiga)

Mis on kaart?

Vikipeedia määratleb kaardi järgmiselt:

„Paljudes programmeerimiskeeltes on kaart kõrgema järgu funktsiooni nimi, mis rakendab antud funktsiooni funktsiooni igale elemendile, nt loendile, tagastades tulemuste loendi samas järjekorras. Seda nimetatakse funktsionaalses vormis sageli kõigile kohaldatavaks . "

How does it work? The map function in JavaScript applies a function to every element inside the array. Please take a moment to re-read that sentence.

Afterwards, the map function returns a new array with the results of applying a function to every element in the array.

Map example:

const array = [1, 1, 1, 1]; // pass a function to map const results = array.map(x => x * 2); console.log(results);

Output:

[2,2,2,2]

We have applied the map function to the array containing four 1's. The map function then multiplied each element by 2, i.e., x * 2, and returned a new array. The new array was then stored in the results variable.

By viewing our output, we can see this worked successfully. Every element in the array has been multiplied by 2. This method can be used as a replacement to a loop in some cases, and is incredibly powerful.

Järeldus

Hästi tehtud! Olete õppinud viis erinevat viisi JavaScripti massiivi kordamiseks. Need on peamised ehituskivid, mis aitavad teil JavaScripti programmeerimise teel edu saavutada.

Samuti olete kokku puutunud arenenud kontseptsiooniga map, mida kasutatakse sageli suuremahulistes tarkvararakendustes.

Niisiis, jätan teile selle: kuidas kavatsete massiive oma projektides kasutada? Ja milline iteratsioonimeetod teile kõige põnevam oli?  

Täname lugemast!

Kui teile minu artikkel meeldis, järgige palun mind ja / või saatke mulle sõnum!  

Twitter • Keskmine • Github