If & else

---

1. Beslissingen
2. If
3. Else
4. Else if
5. Vergelijkingen
6. Meerdere condities (AND/OR)

1. Beslissingen (conditions)

If en Else zijn de meest elementaire onderdelen van beslissingen (Engels: conditions). Beslissingen bepalen of een stuk code wel of niet uitgevoerd wordt, afhankelijk van het optreden van een bepaalde situatie. Men zegt ook wel: als er "aan een bepaalde conditie voldaan wordt" of dat bepaalde code "conditioneel wordt uitgevoerd".

---

2. if

Dit is de eenvoudigste vorm van een beslissing: als de conditie waar is wordt de code tussen { en } uitgevoerd en anders gebeurt er niks.

//dat wat tussen de haakjes staat is de conditie
//als deze conditie waar is, wordt de code uitgevoerd
if(true) {
  console.log("Dit is altijd waar");
}

if(false) {
  console.log("Dit wordt nooit uitgevoerd");
}

In het volgende geval wordt als a > b de regel "a is groter dan b" geschreven. Als a niet groter is dan b, dan gebeurt er niks.

if(a > b) {
  console.log("a is groter dan b");
}

⬆️

---

3. Else

Je kunt ook iets doen als a niet groter is dan b, dat zet je dan tussen de {} haakjes na het 'else' statement:

let a = 4;
let b = 8;
if(a > b) {
  console.log("a is groter dan b");
}
else {
  console.log("a is kleiner dan b of gelijk aan b");
}
//hier komt "a is kleiner dan b of gelijk aan b uit"

⬆️

---

4. Else if

Het komt wel eens voor dat je achter elkaar twe vergelijkingen wil doen, bijvoorbeeld als je bij het drukken op de spatiebalk een variabele of aan of uit wil zetten.

let playState = false;
function keyPressed() {
    //als key gelijk is aan ' ' (spatie)
    if (key === ' ') {
        //als de playState false is, maak er true van
        if (playState === false) {
            playState = true;
        }
        //als de playState true is, maak er false van
        if (playState === true) {
            playState = false;
        }
    }
}

In het bovenstaande geval wordt de variabele playState echter nooit true, omdat na het uitvoeren van de eerste vergelijking, meteen de tweede wordt uitgevoerd en die op dat moment waar is. In de eerste vergelijking wordt er gekeken of playState false is, dat is het geval, dus er wordt true van gemaakt. Daarna wordt er direct gekeken of playState true is, dat is zojuist het geval geworden, dus er wordt weer false van gemaakt.

Om dit te voorkomen bestaat else if. De else geeft aan dat de daaropvolgende if alleen moet worden uitgevoerd als de voorgaande if niet waar was.

In de onderstaande code zal playState wel afwisselend true of false zijn als er op spatief wordt gedrukt.

let playState = false;
function keyPressed() {
    //als key gelijk is aan ' ' (spatie)
    if (key === ' ') {
        //als de playState false is, maak er true van
        if (playState === false) {
            playState = true;
        }
        //als de playState true is en de vorige
        //if niet waar, maak er false van.
       else  if (playState === true) {
            playState = false;
        }
    }
}

⬆️

---

5. Vergelijkingen

Als je twee waarden wil vergelijken, dan kan je dat op verschillende manieren doen. Ze zijn hieronder opgesomd:

3 === 3;    //is gelijk aan; 
            //is 3 gelijk aan 3? Ja, dit is waar.
3 !== 3;    //is niet gelijk aan; 
            //is 3 niet gelijk aan 3? Nee, dit is niet waar.
4 < 3;      //is kleiner dan; 
            //is 4 kleiner dan 3? Nee, dit is niet waar
4 > 3;      //is groter dan; 
            //is 4 groter dan 3? Ja, dit is waar
4 <= 4;     //is kleiner dan of gelijk aan; 
            //is 4 kleiner dan of gelijk aan 4? Ja, dit is waar
4 >= 5;     //is groter dan of gelijk aan; 
            //is 4 groter dan of gelijk aan 5? Nee, dit is niet waar

⬆️

---

6. Meerdere condities (AND/OR)

Als je wilt aangeven dat meerdere dingen tegelijk waar moeten zijn dan gebruik je AND, maar in Javascript schrijf je dat als &&

if(x > 0 && x < 10) {
    console.log("x is groter dan 0 EN kleiner dan 10");
}

Als je wilt aangeven dat van meerdere dingen er maar eentje waar hoeft te zijn dan gebruik je OR, maar in Javascript schrijf je dat als ||

if(x < 0 || x > 10) {
    console.log("x is kleiner dan 0 of groter dan 10");
}

⬆️

---