JavaScript voor beginners: Operators

In de vorige aflevering hebben we het gehad over functies. JavaScript kent een aantal ingebouwde functies, maar we kunnen ook onze eigen (al dan niet "recursieve") functies schrijven. Ook hebben we kort aandacht besteed aan het verschil tussen functies (die horen bij de taal) en methoden (die horen bij een object).

In deze aflevering zullen we het hebben over de operators (of ook wel: operatoren) in JavaScript waarmee allerlei rekenkundige en logische bewerkingen kunnen worden uitgevoerd. Daarbij zullen we ook aandacht besteden aan de "voorrangsregels" die gelden als in een opdracht meer dan één operator wordt gebruikt. Tenslotte zullen we kennis maken met een aantal bronnen op het World Wide Web waar we meer informatie over JavaScript kunnen vinden.

Soorten operators

We hebben eerder in deze cursus gezien hoe we in JavaScript opdrachten herhaald uit kunnen laten voeren. Eén mogelijkheid is het gebruik van een "for-loop" of -herhalingslus. Een dergelijke lus zag er als volgt uit:

for (tel = 1; tel <= 1000; tel++)
{document.write "hallo"}


De for-opdracht bevat drie elementen tussen de haakjes, te weten: een initialisatie van de teller-variabele (tel = 1), een voorwaarde voor uitvoering van de lus (tel <= 1000), en een opdracht voor het bijwerken van de teller-variabele (tel++), gevolgd door de opdracht die herhaald moet worden uitgevoerd (document.write "hallo").

De drie elementen tussen de haakjes bevatten alle een operator, te weten: een toekenningsoperator ("="), een logische operator ("<="), en een berekeningsoperator ("++"). Behalve deze drie soorten operators kent JavaScript nog bitsgewijze operators, alsmede enkele speciale operators. We zullen nu op elke categorie wat nader in gaan.

Toekenningsoperators

De simpelste toekenningsoperator is het is-teken ("="). Dit wordt gebruikt om het resultaat van een expressie toe te kennen aan een variabele, bijvoorbeeld: x = 1 + 2 + 3 of x = y + z.

De andere toekenningsoperators zijn eigenlijk verkorte schrijfwijzen waarmee het is-teken en een andere operator worden gecombineerd. Een voorbeeld daarvan is de operator "+=". De opdracht x += y betekent hetzelfde als x = x + y. Iets vergelijkbaars geldt voor "-=" (x -= 2 is hetzelfde als x = x - 2), "*=" (x *= y is hetzelfde als x = x * y), enzovoort. Ook de nog te bespreken bitsgewijze operators kunnen met het is-teken worden gecombineerd.

Logische operators

De simpelste logische operator is de logische ontkenning, weergegeven door een uitroepteken ("!"), en uitgesproken als "NOT". Deze operator wordt gebruikt om een expressie logisch te ontkennen: als die expressie X de waarde true heeft, dan heeft !X de waarde false, en omgekeerd. Als X een expressie van het type Boolean is, dan ligt deze interpretatie tamelijk voor de hand ("NOT true" is "false" en "NOT false" is "true").

We kunnen de logische ontkenning echter ook combineren met getalsexpressies. In dat geval geldt: als die expressie Y de waarde nul heeft, dan heeft !Y de waarde true; heeft Y een andere waarde dan nul, dan heeft !Y de waarde false. Gebruiken we deze operator met een expressie die ongedefinieerd is of null, of met een stringexpressie die niet in een getalsexpressie kan worden omgezet, dan krijgen we een run-time foutmelding.

Andere logische operators stellen ons in staat om een logische vergelijking uit te voeren. Tot deze categorie behoren "<" (kleiner dan), ">" (groter dan), "<=" (kleiner dan of gelijk aan) en ">=" (groter dan of gelijk aan). Een van deze operators waren we al tegengekomen in de herhalingslus hiervoor: de voorwaarde voor uitvoering van de lus luidde "tel <= 1000". Deze expressie heeft de waarde true als variabele tel een waarde heeft die kleiner is dan, of gelijk aan, duizend, of de waarde false als tel groter is dan duizend.

Deze operators kunnen ook gebruikt worden voor stringexpressies; in dat geval worden de onderliggende Unicode-waarden van de tekens in de string gebruikt voor de vergelijking. De expressie 'a' < 'b' heeft bijvoorbeeld de waarde true, maar 'a' < 'B' heeft de waarde false, omdat hoofdletters een lagere waarde hebben dan kleine letters.

Met de operator "!=" kunnen we testen op ongelijkheid: de expressie X != Y heeft de waarde true als variabele X inderdaad een andere waarde heeft dan variabele Y, of false als de twee variabelen dezelfde waarde hebben. De logische operator "==" (niet te verwarren met toekenningsoperator "="!) test juist op gelijkheid: X == Y is true als de twee variabelen dezelfde waarde hebben, maar false als ze verschillende waarden hebben. Bij deze twee operators worden de twee te vergelijken elementen zonodig eerst omgezet naar hetzelfde type; als gevolg daarvan heeft de expressie '1' == 1 de waarde true.

De operators "&&" en "||" maken het mogelijk om twee expressies te combineren met respectievelijk een logische AND of een logische OR. De expressie X && Y is alleen true als zowel X als Y de waarde true heeft. De expressie X || Y is true als X true is, als Y true is, of als beide true zijn.

Tenslotte moeten we hier de voorwaardelijke operator "?:" noemen. Deze kunnen we beschouwen als een verkorte schrijfwijze voor een if…else-opdracht. Deze operator wordt bijvoorbeeld zo gebruikt: X == Y ? 'gelijk' : 'ongelijk'. We lezen deze expressie als volgt: als het deel links van het vraagteken true is, dan wordt het deel tussen het vraagteken en de dubbele punt als resultaat teruggegeven; is het deel links van het vraagteken false, dan wordt het deel rechts van de dubbele punt als resultaat teruggegeven.

Berekeningsoperators

Tot de groep berekeningsoperators behoren "+", "-", "*", "/" en "%". De operator "+" wordt gebruikt om twee waarden bij elkaar op te tellen, maar ook om twee strings samen te voegen. Als variabelen X en Y beide de waarde 1 hebben, dan geeft X + Y het resultaat 2. Hebben X en Y beide de waarde '1', dan geeft X + Y het resultaat '11'; hetzelfde resultaat krijgen we als de ene variabele de waarde 1 heeft en de andere de waarde '1': de getalsvariabele wordt dan eerst omgezet in een stringvariabele, en vervolgens worden de twee strings samengevoegd. De expressie 'X' + 'Y' tenslotte geeft het resultaat 'XY'

De operator "-" wordt gebruikt om twee waarden van elkaar af te trekken of om het teken van een expressie te veranderen: -X is positief als X negatief is en vice versa.

Met de operators "*" en "/" kunnen we respectievelijk vermenigvuldigen en delen, terwijl we met operator "%" een modulo-bewerking kunnen uitvoeren. Dit houdt in dat er als het ware een staartdeling wordt uitgevoerd waarvan we alleen de rest terugkrijgen. Een voorbeeld: 19 % 7 geeft als resultaat 5, want als we 19 door 7 delen, houden we een rest (19 - 14 =) 5 over.

Daarnaast behoren de operators "++" en "--" tot de groep berekeningsoperators. Met deze operators worden variabelen respectievelijk met een verhoogd of verlaagd. Bij deze operatoren moeten we goed opletten of ze voor of achter de variabele staan: dit maakt namelijk iets uit voor het resultaat!

Laten we aannemen dat variabele Y de waarde 1 heeft. In de opdracht X = ++Y krijgt X dan de waarde 2: de waarde van Y wordt eerst met een verhoogd, en vervolgens wordt het resultaat aan X toegekend. In de opdracht X = Y++ daarentegen krijgt X de waarde 1: de waarde van Y wordt aan X toegekend, en pas daarna wordt de waarde van Y met een verhoogd! Iets soortgelijks geldt voor de operator "--".

De operators "++" en "--" hoeven niet altijd in een toekenningsopdracht gebruikt te worden: ze kunnen ook op zichzelf staan. De opdracht X++ bijvoorbeeld zorgt ervoor dat de waarde van X met een wordt verhoogd; het is dus een verkorte schrijfwijze voor X = X + 1.

Bitsgewijze operators

Aan de bitsgewijze operators zullen we hier niet al te veel aandacht besteden; ze vormen meer voer voor specialisten. Deze operators kunnen alleen gebruikt worden met getallen (Booleans worden eerst omgezet in een getal, net als strings indien dat mogelijk is). Op de binaire schrijfwijze van die getallen wordt vervolgens een bewerking uitgevoerd.

De bitsgewijze NOT ("~") zet alle nullen om in enen en omgekeerd. Als de oorspronkelijke expressie bijvoorbeeld 1011 is, dan is het resultaat van deze operator 0100.

De bitsgewijze OR ("|") vergelijkt de overeenkomstige bits in twee expressies en geeft steeds als resultaat een 1 als minstens een van de twee bits een 1 is, of 0 als beide bits 0 zijn. Als de twee expressies bijvoorbeeld 1100 en 0110 zijn, dan is het resultaat van deze operator 1110.

Verder bevat deze groep nog een bitsgewijze AND ("&"), een bitsgewijze XOR ("^") en bitsgewijze verschuifopdrachten ("<<", ">>" en ">>>").

Speciale operators

Ook aan deze groep besteden we slechts voor de volledigheid aandacht. Met de 'delete'-operator kan een element uit een (nog te behandelen) array worden verwijderd, of een eigenschap uit een (eveneens nog te behandelen) object. Met 'typeof' kan het type van een expressie worden bepaald (de mogelijke resultaten zijn 'number', 'string', 'boolean', 'object', 'function', en 'undefined'). Met 'void' tenslotte kan een expressie worden geëvalueerd zonder dat het resultaat wordt bewaard (deze operator geeft altijd de waarde undefined terug).

Voorrangsregels

In een expressie kunnen meerdere operators gebruikt worden. We hebben daarom regels nodig die aangeven in welke volgorde de JavaScript-operators worden toegepast; een soort uitgebreide "Mijnheer Van Dale wacht op antwoord".

De hiervoor besproken operators worden toegepast in de volgorde die staat aangegeven in het overzicht hieronder. Operators die op een hogere regel staan, hebben voorrang op operators die op een lagere regel staan; operators die op dezelfde regel staan, worden van links naar rechts toegepast. Door middel van haakjes kan van de aangegeven volgorde worden afgeweken: wat tussen haakjes staat, wordt namelijk eerst geëvalueerd.
  1. ++, --, - (negatief maken), ~, !, typeof, void, delete
  2. *, /, %
  3. +, - (aftrekken), + (samenvoegen strings)
  4. <<, >>, >>>
  5. <, <=, >, >=
  6. ==, !=
  7. &
  8. ^
  9. |
  10. &&
  11. ||
  12. ?:
  13. =, OP= (operator gecombineerd met "=", bijvoorbeeld "+=")
Als voorbeeld bezien we de toekenning X = (1 + 2) / 3 * 4 + 5. Allereerst berekenen we 1 + 2, want dat staat tussen haakjes en gaat dus voor. In het dagelijks leven zouden we, volgens de "Mijnheer Van Dale"-regel, nu eerst 3 met 4 vermenigvuldigen en daarna het vorige resultaat 3 delen door 12. In JavaScript staan vermenigvuldigen en delen echter op hetzelfde niveau, en in dat geval is de regel: toepassen van links naar rechts. In ons geval delen we dus eerst 3 (het resultaat van de expressie tussen haakjes) door 3, en vermenigvuldigen de uitkomst 1 vervolgens met 4. Bij het resultaat 4 tellen we 5 op, en het eindresultaat 9 kennen we tenslotte toe aan variabele X.

Informatiebronnen op het World Wide Web

Nu we de basisbeginselen van JavaScript achter de rug hebben, is het wellicht aardig om eens te kijken waar wat meer informatie over deze taal te vinden is.

Laten we beginnen met de bedenker van JavaScript: Netscape biedt uitgebreide informatie over de taal in de "JavaScript Guide".

Daarnaast had Netscape vroeger "View Source Magazine", een online technisch tijdschrift voor ontwikkelaars. Het bevatte onder andere handboeken, voorbeeldscripts, columns en artikelen, presentaties, white papers en discussiegroepen. Helaas is dit tijdschrift niet meer beschikbaar.

Een van de columns in "View Source Magazine" heette "The JavaScript Apostle". Deze column werd verzorgd door Danny Goodman, een goeroe op het gebied van JavaScript. Goodman heeft, als aanvulling op zijn boek "JavaScript Bible", een eigen website met een aantal voorbeelden, een gratis JavaScript Object Roadmap en een Quick Reference Guide.

Ook Microsoft heeft natuurlijk een site met informatie over JScript, de eigen implementatie van JavaScript. Deze site bevat onder andere een tutorial, een Language Reference en een aantal voorbeeldscripts.

Natuurlijk is deze opsomming verre van volledig, maar de genoemde sites bevatten tezamen een enorme hoeveelheid informatie over JavaScript, inclusief een groot aantal verwijzingen voor wie nog meer wil weten.

Conclusie

In deze aflevering hebben we uitgebreid aandacht besteed aan de JavaScript-operators, en we hebben kennis gemaakt met enkele aanvullende bronnen met informatie over JavaScript.

In de volgende aflevering zullen we zien hoe we in JavaScript tekenreeksen of "strings" gebruiken voor het manipuleren van tekstuele informatie. Ook het aan strings verwante onderwerp "arrays" zal dan aan de orde komen.