Enklare om uttalanden alltid betyder renare JavaScript-kod.

Villkorliga uttalanden är en viktig del av JavaScript. De låter dig exekvera kod baserat på om ett givet villkor är sant eller falskt, och du kan kapsla flera elseif uttalanden (och en annan) för att utvärdera mer än ett villkor.

Men här är problemet - när du skriver komplext om annat kedjor kan det snabbt bli rörigt och du kan lätt få kod som är svår att läsa och förstå.

Låt oss lära oss hur man refaktorerar långa och komplexa om... annat om... annat villkorade kedjor till en mer kortfattad, renare och lättare att förstå version.

Complex if...else Kedjor

När du skriver komplexa if...else-satser i JavaScript är det viktigt att du skriver ren, kortfattad och begriplig kod. Ta till exempel en titt på om annat villkorlig kedja i funktionen nedan:

fungerakanDricka(person) {
om(person?.ålder != null) {
om(person.ålder < 18) {
trösta.logga("Fortfarande för ung")
} annanom(person.ålder < 21) {
trösta.logga("Inte i USA")
} annan {
trösta.logga("Får dricka")
}
} annan {
trösta.logga("Du är inte en person")
}
}

konst person = {
ålder: 22
}

instagram viewer

canDrink (person)

Logiken här är enkel. Den första om uttalande säkerställer att person objektet har en ålder egendom (annars är han eller hon inte en person). Inuti det om block, du har lagt till en om... annat... om kedja som i princip säger:

Om personen är yngre än 18 är den för ung för att få en drink. Om de är yngre än 21 år är de fortfarande under den lagliga dricksåldern i USA. Annars kan de lagligt få en drink.

Även om ovanstående kod är giltig, gör kapslingen det svårare för dig att förstå koden. Lyckligtvis kan du omstrukturera koden för att vara kortfattad och lättare att läsa genom att använda en vaktklausul.

Vaktklausuler

När som helst du har en om uttalande som omsluter all din kod kan du använda en vaktklausul för att ta bort alla kapslingar:

fungeracanDrinkBättre() {
om(person?.ålder == null) lämna tillbakatrösta.logga("Du är inte en person")

om(person.ålder < 18) {
trösta.logga("Fortfarande för ung")
} annanom(person.ålder < 21) {
trösta.logga("Inte i USA")
} annan {
trösta.logga("Får dricka")
}
}

I början av funktionen definierade du en skyddsklausul som säger att om det specifika villkoret inte är uppfyllt, vill du avsluta canDrinkBetter() fungerar omedelbart (och logga "Du är inte en person" på konsolen).

Men om villkoret är uppfyllt, utvärderar du om annat kedja för att se vilket block som är tillämpligt. Att köra koden ger dig samma resultat som det första exemplet, men den här koden är lättare att läsa.

Använd inte en enda retur

Du kanske hävdar att ovanstående teknik inte är en bra programmeringsprincip eftersom vi använder flera returer i samma funktion, och du tror att det är bättre att bara ha ett returmeddelande (aka, enkel returpolicy).

Men det här är ett fruktansvärt sätt att skriva kod eftersom det tvingar dig in i samma galna häckningssituationer som vi såg i det första kodexemplet.

Med det sagt kan du använda flera lämna tillbaka uttalanden för att ytterligare förenkla din kod (och bli av med kapslingen):

fungeracanDrinkBättre() {
om(person?.ålder == null) lämna tillbakatrösta.logga("Du är inte en person")

om(person.ålder < 18) {
trösta.logga("Fortfarande för ung")
lämna tillbaka
}

om(person.ålder < 21) {
trösta.logga("Inte i USA")
lämna tillbaka
}

trösta.logga("Får dricka")
}

Den här koden fungerar på samma sätt som de två tidigare exemplen, och den är också lite renare.

Extrahera funktioner för Cleaner Code

Vårt sista kodblock var renare än de två första, men det är fortfarande inte så bra som det kunde vara.

Istället för att ha en lång om annat kedja inuti en funktion kan du skapa en separat funktion canDrinkResult() som gör kontrollen åt dig och returnerar resultatet:

fungeracanDrinkResult(ålder) {
om(ålder < 18) lämna tillbaka"Fortfarande för ung"
om(ålder < 21) lämna tillbaka"Inte i USA"
lämna tillbaka"Får dricka"
}

Sedan i huvudfunktionen är allt du behöver göra att först tillämpa skyddsklausulen innan du anropar canDrinkResult() funktion (med åldern som parameter) för att få resultatet:

fungeracanDrinkBättre() { 
om(person?.ålder == null) lämna tillbakatrösta.logga("Du är inte en person")

låta resultat = canDrinkResult (person.age)
trösta.log (resultat)
}

Så i det här fallet delegerade du uppgiften att kontrollera dricksåldern till en separat funktion och anropade den bara vid behov. Detta gör din kod koncis och mer enkel att arbeta med än alla tidigare exempel.

Håll annat borta från villkorliga uttalanden

Du har lärt dig hur du omstrukturerar komplexa, kapslade villkorliga kedjor till kortare, lättare att läsa med hjälp av skyddssatser och funktionsextraktionstekniken.

Försök att behålla annan uttalande bort från dina villkor så mycket som möjligt genom att använda både skyddsklausuler och funktionsextraktionstekniken.

Om du fortfarande är ny på att använda JavaScript om annat uttalande, börja med grunderna.