JavaScript -variabelen
4 manieren om een JavaScript-variabele te declareren:
- Gebruik makend van
var
- Gebruik makend van
let
- Gebruik makend van
const
- Niets gebruiken
Wat zijn variabelen?
Variabelen zijn containers voor het opslaan van gegevens (het opslaan van gegevenswaarden).
In dit voorbeeld zijn x
, y
, en z
, variabelen, gedeclareerd met het var
sleutelwoord:
Voorbeeld
var x = 5;
var y = 6;
var z = x + y;
In dit voorbeeld zijn x
, y
, en z
, variabelen, gedeclareerd met het let
sleutelwoord:
Voorbeeld
let x = 5;
let y = 6;
let z = x + y;
In dit voorbeeld zijn x
, y
, en z
, niet-gedeclareerde variabelen:
Voorbeeld
x = 5;
y = 6;
z = x + y;
Uit alle bovenstaande voorbeelden kun je raden:
- x slaat de waarde 5 . op
- y slaat de waarde 6 . op
- z slaat de waarde 11 . op
Wanneer JavaScript var gebruiken?
Declareer JavaScript-variabelen altijd met var
, let
, of const
.
Het var
trefwoord wordt gebruikt in alle JavaScript-code van 1995 tot 2015.
De trefwoorden let
en const
zijn in 2015 aan JavaScript toegevoegd.
Als u wilt dat uw code in een oudere browser wordt uitgevoerd, moet u var
.
Wanneer JavaScript-const gebruiken?
Als je een algemene regel wilt: declareer variabelen altijd met const
.
Als je denkt dat de waarde van de variabele kan veranderen, gebruik dan let
.
In dit voorbeeld zijn price1
, price2
, en total
, variabelen:
Voorbeeld
const price1 = 5;
const price2 = 6;
let total = price1 + price2;
De twee variabelen price1
en price2
worden gedeclareerd met het const
sleutelwoord.
Dit zijn constante waarden en kunnen niet worden gewijzigd.
De variabele total
wordt gedeclareerd met het let
sleutelwoord.
Dit is een waarde die kan worden gewijzigd.
Net als algebra
Net als in de algebra bevatten variabelen waarden:
let x = 5;
let y = 6;
Net als in de algebra worden variabelen gebruikt in uitdrukkingen:
let z = x + y;
Uit het bovenstaande voorbeeld kun je raden dat het totaal is berekend op 11.
Opmerking
Variabelen zijn containers voor het opslaan van waarden.
JavaScript-ID's
Alle JavaScript- variabelen moeten worden geïdentificeerd met unieke namen .
Deze unieke namen worden identifiers genoemd .
ID's kunnen korte namen zijn (zoals x en y) of meer beschrijvende namen (leeftijd, som, totaalvolume).
De algemene regels voor het construeren van namen voor variabelen (unieke identifiers) zijn:
- Namen kunnen letters, cijfers, underscores en dollartekens bevatten.
- Namen moeten beginnen met een letter
- Namen kunnen ook beginnen met $ en _ (maar die gebruiken we niet in deze tutorial)
- Namen zijn hoofdlettergevoelig (y en Y zijn verschillende variabelen)
- Gereserveerde woorden (zoals JavaScript-trefwoorden) kunnen niet als naam worden gebruikt
Opmerking
JavaScript-ID's zijn hoofdlettergevoelig.
De toewijzingsoperator
In JavaScript is het gelijkteken ( =
) een "toewijzings"-operator, niet een "gelijk aan"-operator.
Dit is anders dan bij algebra. Het volgende is niet logisch in de algebra:
x = x + 5
In JavaScript is het echter volkomen logisch: het wijst de waarde van x + 5 toe aan x.
(Het berekent de waarde van x + 5 en zet het resultaat in x. De waarde van x wordt verhoogd met 5.)
Opmerking
De operator "gelijk aan" is geschreven zoals ==
in JavaScript.
JavaScript-gegevenstypen
JavaScript-variabelen kunnen getallen zoals 100 bevatten en tekstwaarden zoals "John Doe".
Bij het programmeren worden tekstwaarden tekstreeksen genoemd.
JavaScript kan veel soorten gegevens aan, maar denk nu alleen aan getallen en tekenreeksen.
Strings worden tussen dubbele of enkele aanhalingstekens geschreven. Cijfers zijn geschreven zonder aanhalingstekens.
Als u een getal tussen aanhalingstekens plaatst, wordt het behandeld als een tekenreeks.
Voorbeeld
const pi = 3.14;
let person = "John Doe";
let answer = 'Yes I am!';
Een JavaScript-variabele declareren
Het maken van een variabele in JavaScript wordt een variabele "declareren" genoemd.
U declareert een JavaScript-variabele met het var
of het let
trefwoord:
var carName;
of:
let carName;
Na de declaratie heeft de variabele geen waarde (technisch gezien wel undefined
).
Gebruik het gelijkteken om een waarde aan de variabele toe te kennen:
carName = "Volvo";
U kunt ook een waarde aan de variabele toewijzen wanneer u deze declareert:
let carName = "Volvo";
In het onderstaande voorbeeld maken we een variabele met de naam carName
en kennen we de waarde "Volvo" toe.
Vervolgens "uitvoeren" we de waarde in een HTML-paragraaf met id="demo":
Voorbeeld
<p id="demo"></p>
<script>
let carName = "Volvo";
document.getElementById("demo").innerHTML = carName;
</script>
Opmerking
Het is een goede programmeerpraktijk om alle variabelen aan het begin van een script te declareren.
Eén verklaring, veel variabelen
U kunt veel variabelen in één instructie declareren.
Begin de instructie met var
en scheid de variabelen door een komma :
Voorbeeld
let person = "John Doe", carName = "Volvo", price = 200;
Een aangifte kan meerdere regels omvatten:
Voorbeeld
let person = "John Doe",
carName = "Volvo",
price = 200;
Waarde = niet gedefinieerd
In computerprogramma's worden variabelen vaak gedeclareerd zonder waarde. De waarde kan iets zijn dat moet worden berekend, of iets dat later zal worden verstrekt, zoals gebruikersinvoer.
Een variabele gedeclareerd zonder waarde heeft de waarde
undefined
.
De variabele carName zal de waarde hebben undefined
na het uitvoeren van deze instructie:
Voorbeeld
let carName;
JavaScript-variabelen opnieuw declareren
Als u een JavaScript-variabele die is gedeclareerd met opnieuw declareert var
, verliest deze zijn waarde niet.
De variabele carName
heeft nog steeds de waarde "Volvo" na het uitvoeren van deze instructies:
Voorbeeld
var carName = "Volvo";
var carName;
Opmerking
let
U kunt een variabele gedeclareerd met of niet opnieuw declareren const
.
Dit gaat niet werken:
let carName = "Volvo";
let carName;
JavaScript-rekenkunde
Net als bij algebra kun je rekenen met JavaScript-variabelen, met behulp van operators zoals =
en +
:
Voorbeeld
let x = 5 + 2 + 3;
U kunt ook strings toevoegen, maar strings worden aaneengeschakeld:
Voorbeeld
let x = "John" + " " + "Doe";
Probeer ook dit:
Voorbeeld
let x = "5" + 2 + 3;
Opmerking
Als u een getal tussen aanhalingstekens plaatst, worden de rest van de getallen behandeld als tekenreeksen en aaneengeschakeld.
Probeer nu dit:
Voorbeeld
let x = 2 + 3 + "5";
JavaScript-dollarteken $
Aangezien JavaScript een dollarteken als een letter behandelt, zijn ID's die $ bevatten geldige variabelenamen:
Voorbeeld
let $ = "Hello World";
let $$$ = 2;
let $myMoney = 5;
Het gebruik van het dollarteken is niet erg gebruikelijk in JavaScript, maar professionele programmeurs gebruiken het vaak als een alias voor de hoofdfunctie in een JavaScript-bibliotheek.
In de JavaScript-bibliotheek jQuery wordt bijvoorbeeld de hoofdfunctie
$
gebruikt om HTML-elementen te selecteren. In jQuery $("p");
betekent "selecteer alle p-elementen".
JavaScript-onderstrepingsteken (_)
Aangezien JavaScript het onderstrepingsteken als een letter behandelt, zijn id's met _ geldige variabelenamen:
Voorbeeld
let _lastName = "Johnson";
let _x = 2;
let _100 = 5;
Het gebruik van het onderstrepingsteken is niet erg gebruikelijk in JavaScript, maar een conventie onder professionele programmeurs is om het te gebruiken als een alias voor "private (verborgen)" variabelen.