Javascript, je houdt ervan, en je moet toch altijd een beetje huilen.
Want 1 + ‘3’ - ‘3’ = 10
Dit ervaar ik al ruim 10 jaar. Een van de ergste pijnpunten waar ik tot op de dag van vandaag tegenaan blijf lopen - zeg maar: zoiets als je scheenbeen steeds stoten op dezelfde plek - blijft toch het toepassen van zogenaamde Logical Operators.
We kunnen er niks aan doen, JavaScript blijft Loosely Typed. Kort door de bocht betekent dit dat deze taal zich niet te veel bezighoudt met types
, en voert conversies automatisch uit. Ja, dat lees je goed; automated typecastings
!
Let op, niet schrikken:
De +
operator cast het liefst naar een String; de -
operator naar een Number; enz… Probeer er maar niet te veel over na te denken, accepteren is beter als genezen…
Truthy && Falsy
Doordat JavaScript zo vergefelijk is betreffende automatische type conversies, wordt er binnen de community veelal gesproken over truthy
en falsy
als het gaat om het variabelen in statements.
Stamp deze goed in je hoofd als je dit onderwerp wilt begrijpen, een logische lijst bestaat eigenlijk niet:
Falsy
- Een lege String, oftewel een String met een
length
van 0 - Number 0
- false
- undefined
- null
- NaN
Truthy
- Lege Arrays (
[]
) - Lege Objecten (
{}
) - Al het andere!!
Combineren/Chaining
Binnen Logical Operators werkt het principe van truthy/falsy
niet anders.
Je kan ze gebruiken om code in te korten, waardoor je kostbare coderegels bespaart. Vaak zijn het leuke hulpmiddelen en helpen ze je code schoon te houden, maar ze kunnen ook verwarring veroorzaken, vooral wanneer ze aan elkaar ketent.
Logische Operators combineren in feite twee expressies en zullen ofwel waar, onwaar of de overeenkomende waarde teruggeven en worden gerepresenteerd door &&
, wat AND
betekent - evenals ||
, wat OR
betekent. Kijk maar:
console.log(true && true) // true
console.log(false && true) // false
console.log(true && false) // false
console.log(false && false) // false
console.log(true || true) // true
console.log(true || false) // true
console.log(false || true) // true
console.log(false || false) // false
So far so good.
Het wordt echt leuk als we Logical Operators gaan combineren en andere waardes invoeren als simpele Booleans.
Nog steeds geldt:
&&
: De eerstefalsy
waarde wordt teruggegeven. Als die er niet is, wordt de laatstetruthy
waarde teruggegeven.||
: De eerstetruthy
waarde wordt teruggegeven. Als die er niet is, wordt de laatstefalsy
waarde teruggegeven.
Nu we weten wat truthy/falsy
kan veroorzaken, en dat Javascript automatisch conversies uitvoert, is het tijd voor een ritje in de botsauto’s:
console.log(0 && {a: 1}) // 0
console.log(false && 'a') // false
console.log('2' && 5) // 5
console.log([] || false) // []
console.log(NaN || null) // null
console.log(true || 'a') // true
Laat dit even inwerken. Lees dit vooral nog een keer, en niet vlak voordat je wilt gaan slapen, maar juist ‘s ochtends met een stevige kop koffie in je hand…
Ook voor bij de koffie: Deze talk is erg duidelijk en heerlijk sarcastisch.