Miksi voit't rikkoa a forEach loop | ByteSize JS

I recently had a coding interview that involving one schema against another. Sen yksityiskohdat eivät ole niin tärkeitä, mutta yksi asia, joka siitä (kesken haastattelun) tuli, oli se, ettei forEach() – luupista voi murtautua ulos. Olin unohtanut sen pikku herkkupalan ja se luultavasti pilasi mahdollisuuteni saada töitä. Kun olet lukenut tämän, toivottavasti et tee samaa virhettä kuin minä! Älä ole kuin minä.

https://media.giphy.com/media/nRkQduJDZ43bW/giphy.gif

jos haluat mieluummin katsoa kuin lukea, katso videoversio tästä!

MDN tietää kaikki

kuten MDN toteaa:

keulan() lenkkiä ei voi pysäyttää tai katkaista muuten kuin heittämällä poikkeuksen. Jos tällaista käytöstä kaipaa, forEach () – metodi on väärä työkalu

se on MDN-dokumenteista lähtöisin oleva hardcore sass. He ovat kuitenkin oikeassa, tietäen, mikä työkalu valita on tärkeää.

ennen kuin mennään liian syvälle siihen, miksi forEach(): stä ei voi murtautua ulos, tutkitaan, mikä silmukka edes on ja mistä forEach() on peräisin.

mikä on silmukka

ohjelmoinnissa oleva silmukka ratkaisee melko yleisen ongelman: Minun täytyy käyttää samaa koodia kaikkia näitä tietoja vastaan. Yksinkertaisesti sanottuna se on:

toistetaan samaa koodia uudestaan ja uudestaan (silmukassa), kunnes saavutamme määritellyn lopputilan.

ongelma

vertailun vuoksi sama ongelma ratkaistaan eri silmukkatyyppien avulla. Tässä on ongelma:

vertaa kahta ryhmää ja katso, ovatko niissä olevat kohteet samoja.

tässä vertailtavat tiedot:

 const jedis = const sith = 

meillä on kaksi ryhmää, joilla molemmilla on pari nimeä. Huomaat varmaan, että Anakin on sekä Jedi että Sith. Tämä on vähäpätöinen esimerkki, mutta ei kaukana siitä, mitä minua testattiin haastattelun aikana.

vanha tapa

se mitä en halua teidän saavan tästä artikkelista on, että yksi silmukka on parempi kuin toinen. Ne kaikki tarjoavat ainutlaatuisia ohjelmointiratkaisuja ja niissä on paikka tiettyihin käyttötapauksiin. Juju on tietää, mitä käyttää milloin.

Traditional For Loop

jos olet joskus käynyt jonkinlaisen ohjelmointikurssin, olet todennäköisesti altistunut hyvälle ystävällemme for loopille. Se on ollut kätevä työkalu ohjelmoijille pitkään ja on edelleen hyödyllinen tänään. Ratkaistaan ongelmamme käyttämällä sitä.

// Our data again, for referenceconst jedis = ;const sith = ;// start our loop, define our iterator variablefor (let i = 0; i < jedis.length; i++) { // create a variable we can reference const thisJedi = jedis; // see if the item in the array we are testing exists if (sith.includes(thisJedi)) { // If it does exist, then that jedi is also a sith console.log(`${thisJedi} is also a Sith`); // we can exit out break; } console.log(`${thisJedi} is not a Sith`);}

for loop tarjoaa melko näppärän tavan poistua koodistamme, jos se täyttää valitsemamme ehdon. Tämä on erittäin hyödyllistä, kun looping yli TON tietoja. Se on ollut erittäin hyödyllistä ratkaista joitakin hankkeen Euler ongelmia, erityisesti tämä yksi.

Uusi toinen tapa

muun muassa forEach() leimattiin spec: ssä vuonna 2009 yhdessä kaiken muun meille ES5: ssä annetun hyvyyden kanssa. Se toimii kätevä tapa kirjoittaa puhdasta koodia, joka helposti iterates yli kohteita array.

mitä se tekee?

a forEach() silmukka on funktio, joka suorittaa jonkin joukon jokaiselle alkiolle toisen funktion (callback). Me määrittelemme, mitä tapahtuu, että callback toiminto. JS on tarpeeksi mukava antaa meille kolme parametria, että funktio:

  1. taulukon kohde
  2. kohteen indeksi
  3. koko joukko

Katsotaanpa ongelmaamme käyttämällä forEach() silmukkaa sen sijaan. Olen sisällyttänyt kaikki kolme parametria funktioon, mutta käytämme vain ensimmäistä, kohdetta, jonka nimeän.jedi

 // We have to create a global state variable to keep track of what is happening let matching // loop over array jedis.forEach((jedi,index,array) => { // check to see if jedi is in sith if(!sith.includes(jedi)) { // if it isn't, set global variable to false matching = false } // it keeps going... }) console.log(matching) // false

jos se on järkevämpää, voit muokata callback-funktion nimetyksi funktioksi. Luulen, että se tekee siitä hieman luettavamman. Sen avulla voimme myös käyttää tätä toimintoa uudelleen missä haluamme. JEE funktionaalista ohjelmointia!

 let matching function isJediAlsoSith(jedi,index,array) { if(!sith.includes(jedi)) { matching = false } } jedis.forEach(isJediAlsoSith)

ratkaisumme toimii periaatteessa samoin. Ainoa ero on se, että se pitää käynnissä, kunnes se saavuttaa jedis joukon lopun. Näin pieneen kokoonpanoon en usko, että sillä on suurta vaikutusta suorituskykyyn.

Mutta Miksi?

tästä päästään vihdoin kysymykseen, miksi emme voi murtautua ulos forEach() luupista? Se johtuu siitä, että silmukka ajaa tuota takaisinkutsutoimintoa jokaisen kohteen päälle, joten vaikka kirjoittaisit return, se palaa vain kyseiseen funktion ilmentymään. Se jatkuu. Funktion forEach() tapauksessa se ei tee mitään palautetulla koodilla. Ole tietoinen, että ei pidä paikkaansa joidenkin muiden Array menetelmiä.

tämän lisäksi break tai continue eivät ole päteviä väittämiä.

muita tapoja

on melko vähän erilaisia silmukoita. Niillä kaikilla on eri tarkoitusperät, ja suosittelen tutkimaan jokaisen. Aina ei tarvita forEach() luuppia.

https://media.giphy.com/media/tnwuVMx6n1VtK/giphy.gif

forEach () vs map ()

todennäköisesti yleisimmät matriisimenetelmät, jotka esiintyvät tutorialeissa, ovat forEach() ja map() . Suurin ero näiden kahden välillä on se, että map palauttaa uuden joukon, kun taas forEach() ei.

perinteiset silmukat

kun taas silmukka

Array Methods

Array.forEach ()

Array.kartta ()

Array.suodatin ()

Array.reduce ()

Array.reduceRight ()

Array.jokainen ()

Array.some ()

Array.indexOf ()

Array.lastIndexOf ()

Array.etsi ()

Array.findIndex()

Iteroitavat Esinesilmukat (mukaan lukien taulukot)

for

for

näin käy

Baby Yoda

kuten aiemmin mainittiin uskomattoman nenäkäs MDN docs, valitsemalla oikea työkalu on ensiarvoisen tärkeää menestykselle. Vaihtoehtojen määrä voi tuntua aluksi hieman ylivoimaiselta, mutta haluan ottaa lähestymistavan: ”jos se toimii, se on oikea työkalu.”

yleisesti ottaen koodisi voi muotoilla uudelleen kuoliaaksi, mutta sitten vain tuhlaat aikaa voisit olla rakentamassa tavaraa. Haastattelussani käytin oikeaa työkalua, väärää tapaa. Jos olisin tiennyt muistaa, että et voi murtautua ulos forEach silmukka, things probably would have turned out different️️.

jos sinulla on lisäinfoa, pudota se alla oleviin kommentteihin!

kuten aina, onnellista koodausta.

pistokkeet

kirjoitan kirjaa graafisesta suunnittelusta ja siitä, miten se liittyy ohjelmistokehitykseen! Jos olet kiinnostunut, rekisteröidy tästä päivityksiä.

https://digitalnutt.substack.com/p/coming-soon?r=34slo&utm_campaign=post&utm_medium=web&utm_source=copy

Musiikki

kirjoitan myös musiikkia! Katso se täältä: Spotify / Youtube / Apple Music

tuki

Jos pidät tästä artikkelista ja haluat nähdä lisää, Paras tapa tehdä se on tilata/seuraa minua täällä! Jos tunnet olevasi armollinen, voit tarjota minulle kahvia!



+