Elk programma moet kunnen reageren. Een gebruiker klikt op een knop. Een API geeft gegevens terug. Een formulierveld wordt leeg. Zonder een manier om vertakkingen te maken, zou je code regel voor regel worden uitgevoerd, ongeacht wat er daadwerkelijk gebeurt. Conditionals geven JavaScript het vermogen om te kiezen. Ze zijn de besluitvormers binnen je functies, de poortwachters die bepalen wat wordt uitgevoerd en wat wordt overgeslagen. Zodra je begrijpt hoe je ze goed schrijft, stop je met het schrijven van rigide scripts en begin je met het bouwen van software die daadwerkelijk reageert.
Waarom conditionals belangrijk zijn
Control flow is de ruggengraat van logica. Je gebruikt conditionals om wachtwoorden te valideren voordat je ze naar een server stuurt. Je controleert of een winkelwagentje leeg is voordat je de belasting berekent. Je detecteert of een netwerkverzoek is mislukt, zodat je een foutmelding kunt tonen in plaats van een leeg scherm. Al deze scenario's berusten op hetzelfde eenvoudige idee: evalueer iets en handel er vervolgens naar.
Zonder conditionals zou je applicatie een monoloog zijn in plaats van een gesprek. Het zou verschillende datasituaties niet kunnen afhandelen, fouten niet elegant kunnen beheren of niet op een zinvolle manier op gebruikersacties kunnen reageren. Ze laten je controleren hoe je programma draait onder de onzekerheden van de echte wereld.
Het basis if-statement
De eenvoudigste plek om te beginnen is de op zichzelf staande if. Het zegt: als dit waar is, voer dan deze taak uit. Dat is alles. Geen fallback, geen alternatief pad.
if (x % 2 === 0) {
console.log("Even");
}
In dit fragment controleert de modulus-operator of x deelbaar is door twee zonder restwaarde. Wanneer de restwaarde nul is, logt de console de string. Als x oneven is, gebeurt er niets. Het blok wordt genegeerd en de uitvoering gaat hieronder verder.
Dat stille negeren is belangrijk. Soms wil je slechts één actie beschermen. Misschien wil je alleen een CSS-klasse aan een knop toevoegen wanneer deze actief is, of een item aan een array toevoegen alleen wanneer de invoer niet leeg is. Een enkel if-statement handelt die momenten af zonder je te dwingen logica te schrijven die je niet nodig hebt.
Een alternatief toevoegen met if-else
Echte beslissingen hebben meestal twee kanten. Of de gebruiker is oud genoeg, of niet. Of de betaling is geslaagd, of is mislukt. De if-else-structuur dekt beide af.
if (age >= 18) {
console.log("Adult");
} else {
console.log("Not an Adult");
}
Het else-blok vangt alles op wat de eerste conditie heeft afgewezen. Het creëert een heldere binaire vertakking. Dit patroon werkt goed voor toggles, permissies en feature flags. Houd de logica binnen elk blok gefocust. Als je merkt dat je te veel taken in één vertakking stapelt, is dat meestal een teken om het werk op te splitsen in kleinere functies.
Meerdere paden controleren met else if
Het leven biedt zelden slechts twee keuzes. Je moet misschien een getal categoriseren als positief, negatief of nul. Je moet misschien een verzendtarief toewijzen op basis van gewichtsklassen. Gebruik else if voor geordende, meervoudige vergelijkingen.
if (x > 0) {
console.log("Positive");
} else if (x < 0) {
console.log("Negative");
} else {
console.log("Zero");
}
JavaScript evalueert deze van boven naar beneden. Zodra één conditie wordt doorstaan, wordt dat blok uitgevoerd en wordt de rest genegeerd. De volgorde is belangrijk. Als je x > 0 zou controleren nadat je x > 100 hebt gecontroleerd, zou de strengere controle nooit worden uitgevoerd omdat de lossere controle hem eerst zou opvangen. Zie else if als een prioriteitenlijst.
Het switch-statement
Wanneer je één waarde vergelijkt met veel verschillende opties, kan een lange keten van else if-statements repetitief aanvoelen. Een switch-statement ruimt dat op. Het vergelijkt een expressie met case-clausules en voert het bijpassende blok uit.
switch (true) {
case marks >= 90:
Branch = "Computer science";
break;
case marks >= 80:
Branch = "Mechanical";
break;
default:
Branch = "Other";
}
Dit voorbeeld gebruikt switch(true) om boolean-condities direct te evalueren, wat een veelvoorkomend JavaScript-patroon is wanneer je logica afhankelijk is van bereiken in plaats van exacte gelijkheid. Het break-trefwoord is essentieel. Zonder dit loopt de uitvoering door naar de volgende case, ongeacht of deze overeenkomt, wat zelden is wat je hier wilt. De default-clausule werkt als een laatste else en vangt alles op wat niet in de eerdere cases paste.
Switch blinkt uit wanneer je duidelijke, vaste opties hebt. Het is vaak gemakkelijker te scannen dan een hoge stapel else if-blokken, vooral wanneer elke vertakking simpelweg een waarde toewijst of een enkele functie aanroept.
De ternaire operator
Voor korte binaire beslissingen houdt de ternaire operator de boel compact. Het neemt drie operanden: een conditie, een waarde als het waar is, en een waarde als het onwaar is.
const result = (age >= 18) ? "Eligible" : "Not eligible";
Je kunt het gebruiken voor snelle toewijzingen of inline returns. Het werkt goed wanneer de uitkomst een eenvoudige expressie is. Weersta de drang om ternaire operatoren drie niveaus diep te nesten. Een geneste ternaire operator bespaart misschien regels, maar het kost leesbaarheid. Wanneer je logica groeit, is een if-else-blok meestal vriendelijker voor de volgende ontwikkelaar die het bestand opent.
Geneste beslissingen
Complexe logica vereist soms het stellen van vervolgvragen. Je kunt een if in een andere if nesten om een beslissing te verfijnen.
if (weather === "sunny") {
if (temp > 30) {
console.log("
