jeg havde for nylig en kodningssamtale, der involverede evaluering af et skema mod et andet. Detaljerne i det er ikke så vigtige, men en ting der kom ud af det (midt i samtalen) var, at du ikke kan bryde ud af en forEach() loop. Jeg havde glemt den lille godbid, og det skruede sandsynligvis mine chancer for at blive ansat. Når du har læst dette, forhåbentlig, du vil ikke begå den samme fejl, som jeg gjorde! Vær ikke som mig.
hvis du foretrækker at se end at læse, skal du tjekke videoversionen af dette!
MDN kender alle
som bemærket af MDN:
der er ingen måde at stoppe eller bryde en foreach() loop andet end ved at kaste en undtagelse. Hvis du har brug for en sådan adfærd, er forEach () – metoden det forkerte værktøj
det er noget hardcore sass, der kommer fra MDN docs. Men de har ret, at vide, hvilket værktøj der skal vælges, er vigtigt.
før vi kommer for dybt ind i, hvorfor du ikke kan bryde ud af en forEach(), lad os undersøge, hvad en loop selv er, og hvor forEach() kom fra.
Hvad er en Loop
en loop i programmering løser et ret almindeligt problem: Jeg skal køre den samme kode mod alle disse data. Kort sagt, det er:
gentag den samme kode igen og igen (på loop), indtil vi når en defineret sluttilstand.
problemet
for sammenligningens skyld skal vi løse det samme problem ved hjælp af de forskellige sløjfetyper. Her er problemet:
Sammenlign to arrays og se om emnerne i dem er de samme.
her er de data, vi skal sammenligne:
const jedis = const sith = vi har to arrays, begge med et par navne. Du vil sikkert bemærke, at Anakin er både en Jedi og en Sith. Dette er et trivielt eksempel, dog ikke langt væk fra det, jeg blev testet på under min samtale.
den gamle måde
hvad jeg ikke vil have dig til at få fra denne artikel er, at en loop er bedre end en anden. De tilbyder alle unikke programmeringsløsninger og har plads til specifikke brugssager. Tricket er at vide, hvilken man skal bruge hvornår.
traditionel For Loop
hvis du nogensinde har taget nogen form for programmeringskursus, har du sandsynligvis været udsat for vores gode ven for loop. Det har været et praktisk værktøj for programmører i lang tid og er stadig nyttigt i dag. Lad os løse vores problem ved at bruge 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 tilbyder en ret praktisk måde at afslutte vores kode på, hvis den opfylder en betingelse, vi vælger. Dette er uhyre nyttigt, når looping over et TON af data. Det har været meget nyttigt at løse nogle af projektets Euler-problemer, specifikt denne.
den nye anden måde
blandt andet blev forEach() stemplet i spec i 2009 sammen med al den anden godhed, der blev givet os i ES5. Det tjener som en praktisk metode til at skrive ren kode, der nemt gentager over elementer i et array.
Hvad laver det?
a forEach() loop er en funktion, der kører en anden funktion (tilbagekald) på hvert element i et array. Vi definerer, hvad der sker i den tilbagekaldsfunktion. JS er rart nok til at give os tre parametre i denne funktion:
- elementet i arrayet
- indekset for varen
- hele arrayet
lad os se på vores problem ved hjælp af en forEach() loop i stedet. Jeg har inkluderet alle tre parametre i funktionen, men vi bruger kun den første, elementet, som jeg navngiver 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) // falsehvis det giver mere mening, kan du refactor tilbagekaldsfunktionen til en navngivet funktion. Jeg synes, det gør det lidt mere læsbart. Det giver os også mulighed for at genbruge denne funktion, hvor vi vil. Yay funktionel programmering!
let matching function isJediAlsoSith(jedi,index,array) { if(!sith.includes(jedi)) { matching = false } } jedis.forEach(isJediAlsoSith)vores løsning gør i det væsentlige det samme. Den eneste forskel er, at den fortsætter med at køre, indtil den når slutningen af jedis arrayet. For en række af en så lille størrelse tvivler jeg på, at det vil gøre meget af en præstationsforskel.
Men Hvorfor?
dette bringer os endelig til svaret på vores spørgsmål, Hvorfor kan vi ikke bryde ud af en forEach() loop? Det er fordi sløjfen kører den tilbagekaldsfunktion over hvert element, så selvom du skriver en return, vender den kun tilbage på den forekomst af funktionen. Det fortsætter. I tilfælde af forEach() – funktionen gør det ikke noget med den returnerede kode. Vær opmærksom på, det er ikke tilfældet for nogle af de andre Array metoder.
derudover er break eller continue på grund af dette ikke gyldige udsagn.
andre måder
der er en hel del forskellige typer løkker. De har alle forskellige formål, og jeg vil anbefale at undersøge hver enkelt. Du har ikke altid brug for en forEach() loop.
forEach () vs map ()
sandsynligvis er de mest almindelige array-metoder, der vises i tutorials, forEach() og map() . Den største forskel mellem de to er, at map vil returnere et nyt Array, mens en forEach() ikke vil.
traditionelle sløjfer
Mens loop
Array metoder
Array.forEach ()
Array.kort ()
Array.filter ()
Array.reducer ()
Array.reduceRight ()
Array.hver ()
Array.nogle ()
Array.indeks ()
Array.lastindeks ()
Array.finde ()
Array.findindeks()
Iterable Objektsløjfer (inklusive Arrays)
for i
for af
dette er vejen
som nævnt tidligere af de utroligt sassy MDN-dokumenter, vælger det rigtige værktøj er altafgørende for succes. Antallet af muligheder kan virke lidt overvældende i starten, men jeg kan godt lide at tage tilgangen til: “hvis det fungerer, er det det rigtige værktøj.”
generelt kan du refactor din kode til døden, men så spilder du bare tid, du kunne bygge ting. I tilfælde af min samtale brugte jeg det rigtige værktøj, den forkerte måde. Havde jeg vidst husket, at du ikke kan bryde ud af en forEach loop, ville tingene sandsynligvis have vist sig anderledes.
hvis du har yderligere info share, så drop det i kommentarerne nedenfor!
som altid, glad kodning.
Plugs
jeg skriver en bog om Grafisk design og hvordan det relaterer til programmeludvikling! Hvis du er interesseret, Tilmeld dig her for opdateringer.
https://digitalnutt.substack.com/p/coming-soon?r=34slo&utm_campaign=post&utm_medium=web&utm_source=copy
Musik
jeg skriver også musik! Tjek det ud her: Spotify / Youtube / Apple Music
Support
hvis du kan lide denne artikel og vil se mere, er den bedste måde at gøre det på at abonnere/følge mig her! Hvis du føler dig nådig, kan du købe mig en kop kaffe!
