Varför du kan 't bryta en forEach loop / ByteSize JS

jag hade nyligen en kodningsintervju som involverade utvärdering av ett schema mot ett annat. Detaljerna i det är inte så viktiga, men en sak som kom ut ur det (i mitten av intervjun) var att du inte kan bryta ut ur en forEach() slinga. Jag hade glömt den lilla godbit och det förmodligen skruvas upp mina chanser att få hyras. När du läser detta, förhoppningsvis, du kommer inte att göra samma misstag som jag gjorde! Var inte som jag.

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

om du föredrar att titta på än att läsa, kolla in videoversionen av detta!

MDN vet allt

som noterat av MDN:

det finns inget sätt att stoppa eller bryta en forEach() slinga annat än genom att kasta ett undantag. Om du behöver sådant beteende är forEach () – metoden fel verktyg

det är lite hardcore sass som kommer från MDN-dokumenten. Men de har rätt, att veta vilket verktyg att välja är viktigt.

innan vi går för djupt in i varför du inte kan bryta ut ur en forEach(), låt oss undersöka vad en slinga är och var forEach() kom ifrån.

Vad är en slinga

en slinga i programmering löser ett ganska vanligt problem: Jag måste köra samma kod mot alla dessa data. Enkelt uttryckt är det:

upprepa samma kod om och om igen (på loop) tills vi når ett definierat slutläge.

problemet

för jämförelsens skull kommer vi att lösa samma problem med de olika slingtyperna. Här är problemet:

jämför två arrayer och se om objekten i dem är desamma.

här är de data vi ska jämföra:

 const jedis = const sith = 

vi har två matriser, båda med ett par namn. Du kommer förmodligen märka att Anakin är både en Jedi och en Sith. Detta är ett trivialt exempel, men inte långt ifrån vad jag testades på under min intervju.

det gamla sättet

vad jag inte vill att du ska få från den här artikeln är att en slinga är bättre än en annan. De erbjuder alla unika programmeringslösningar och har en plats för specifika användningsfall. Tricket är att veta vilken man ska använda när.

traditionell för Loop

om du någonsin har tagit någon typ av programmeringskurs har du förmodligen blivit utsatt för vår goda vän for loop. Det har varit ett praktiskt verktyg för programmerare under lång tid och är fortfarande användbart idag. Låt oss lösa vårt problem med det.

// 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 erbjuder ett ganska praktiskt sätt att lämna vår kod om den uppfyller ett villkor vi väljer. Detta är oerhört användbart när looping över massor av data. Det har varit till stor hjälp för att lösa några av Project Euler-problemen, särskilt den här.

The New Another Way

bland annat stämplades forEach() i specifikationen 2009 tillsammans med all annan godhet som gavs oss i ES5. Det fungerar som en praktisk metod för att skriva ren kod som enkelt itererar över objekt i en array.

Vad gör det?

en forEach() loop är en funktion som kör en annan funktion (återuppringning) på varje objekt i en array. Vi definierar vad som händer i den återuppringningsfunktionen. JS är tillräckligt bra för att ge oss tre parametrar i den funktionen:

  1. objektet i matrisen
  2. indexet för objektet
  3. hela matrisen

Låt oss ta en titt på vårt problem med en forEach() loop istället. Jag har inkluderat alla tre parametrarna i funktionen, men vi använder bara den första, objektet, som jag namnger 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

om det är mer meningsfullt kan du refactor återuppringningsfunktionen till en namngiven funktion. Jag tror att det gör det lite mer läsbart. Det gör det också möjligt för oss att återanvända denna funktion vart vi vill. Yay funktionell programmering!

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

vår lösning gör i huvudsak samma sak. Den enda skillnaden är att den fortsätter att springa tills den når slutet av jedis – arrayen. För en array av en sådan liten storlek tvivlar jag på att det kommer att göra mycket av en prestandaskillnad.

Men Varför?

detta leder oss äntligen till svaret på vår fråga, Varför kan vi inte bryta ut ur en forEach() – slinga? Det beror på att slingan kör den återuppringningsfunktionen över varje objekt, så även om du skriver en return återkommer den bara på den instansen av funktionen. Det fortsätter. När det gäller funktionen forEach() gör den ingenting med den returnerade koden. Var medveten om att det inte är fallet för några av de andra Arraymetoderna.

dessutom, på grund av detta, break eller continue är inte giltiga uttalanden.

andra sätt

det finns en hel del olika typer av slingor. De har alla olika syften och jag rekommenderar att du tittar på var och en. Du behöver inte alltid en forEach() – slinga.

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

forEach () vs map ()

sannolikt är de vanligaste arraymetoderna som visas i handledning forEach() och map() . Den största skillnaden mellan de två är att map kommer att returnera en ny Array, medan en forEach() inte kommer att göra det.

traditionella slingor

medan slinga

Arraymetoder

Array.forEach ()

Array.kort ()

Array.filtrera ()

Array.minska ()

Array.reduceRight ()

Array.varje ()

Array.några ()

Array.indexOf ()

Array.lastIndexOf ()

Array.hitta ()

Array.findIndex()

Iterable Object Loops (inklusive Arrays)

för i

för av

Detta är vägen

Baby Yoda

som tidigare nämnts av de otroligt sassy MDN docs, är att välja rätt verktyg avgörande för framgång. Antalet alternativ kan verka lite överväldigande först, men jag gillar att ta tillvägagångssättet: ”om det fungerar är det rätt verktyg.”

generellt sett kan du refactor din kod till döds, men då slösar du bara tid du kan bygga saker. När det gäller min intervju använde jag rätt verktyg, på fel sätt. Hade jag vetat kom ihåg att du inte kan bryta ut ur en forEach loop, saker förmodligen skulle ha visat sig olika bisexuell.

om du har ytterligare information dela, vänligen släpp den i kommentarerna nedan!

som alltid, glad kodning.

pluggar

jag skriver en bok om grafisk design och hur den relaterar till mjukvaruutveckling! Om du är intresserad, registrera dig här för uppdateringar.

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

Musik

jag skriver också musik! Kolla in det här: Spotify / Youtube / Apple Music

stöd

om du gillar den här artikeln och vill se mer, det bästa sättet att göra det är att prenumerera/följ mig här! Om du känner dig nådig kan du köpa mig en kaffe!



+