JavaScriptvariabele: Declareer, wijs een waarde toe met voorbeeld

⚡ Slimme samenvatting

JavaScriptvariabelen slaan waarden op zoals namen en getallen, of het resultaat van een expressie. Door een variabele te declareren met `var`, `let` of `const` wordt een benoemde plek gereserveerd die de rest van het script kan lezen en bijwerken.

  • 🔘 Verklaring: De sleutelwoorden var, let of const creëren de naam voordat er ook maar één regel code is die deze leest of schrijft.
  • ☑️ Opdracht: Een enkel gelijkheidsteken kopieert een waarde naar de variabele, hetzij op de declaratieregel of later.
  • Naamgeving: Namen beginnen met een letter, een dollarteken of een underscore, en hoofdletters en kleine letters worden als verschillend beschouwd.
  • 🧪 Moderne trefwoorden: `const` is geschikt voor waarden die nooit veranderen, `let` voor waarden die dat wel doen, en `var` wordt vooral nog gebruikt in oudere scripts.
  • Domein: `let` en `const` blijven binnen hun omringende accolades, terwijl `var` de volledige omringende functie bereikt.
  • 📌 Veel voorkomende fouten: Het opnieuw toewijzen van een constante, het te vroeg lezen van een `let`, of het weglaten van het trefwoord leiden elk tot een aparte fout.

Het verklaren van een JavaEen scriptvariabele en er een waarde aan toewijzen.

Variabelen worden gebruikt om waarden (naam = "John") of expressies (som = x + y) op te slaan. Elke waarde die een script later nodig heeft – een gebruikersnaam, een lopend totaal, een ja-of-nee-vlag – bevindt zich in een variabele. Het correct declareren en benoemen van variabelen is daarom de eerste vaardigheid die je moet leren. JavaScript.

Variabelen declareren in JavaScript

Voordat je een variabele kunt gebruiken, moet je deze eerst declareren. Je gebruikt het sleutelwoord `var` om een ​​variabele te declareren, bijvoorbeeld zo:

var name;

De declaratie op zich creëert de naam en verder niets. Op dit punt bestaat de variabele wel, maar heeft de speciale waarde 'undefined', omdat er nog geen waarde aan is toegekend.

⚠️ Versie-opmerking: `var` is het oorspronkelijke declaratiesleutelwoord en werkt nog steeds in elke browser. ES6 (2015) heeft dit toegevoegd. laten en const, wat de sleutelwoorden van het moderne zijn JavaScriptgebruik. Beide worden verderop op deze pagina vergeleken met var.

Wijs een waarde toe aan de variabele

U kunt tijdens het declareren van de variabele of na het declareren van de variabele een waarde aan de variabele toewijzen.

var name = "John";

OR

var name;

name = "John";

Beide vormen leiden tot hetzelfde resultaat. Het enkele gelijkheidsteken is de toewijzingsoperatorHet kopieert de waarde aan de rechterkant naar de variabele aan de linkerkant. Het is geen test voor gelijkheid, die wordt geschreven als == of === en hoort thuis in Voorwaardelijke stellingen.

Variabelen benoemen

Hoewel je variabelen naar eigen inzicht kunt benoemen, is het een goede programmeerpraktijk om beschrijvende en betekenisvolle namen aan variabelen te geven. Bovendien moeten variabelenamen met een letter beginnen en zijn ze hoofdlettergevoelig. De variabelen studentname en studentName zijn dus verschillend omdat de letter 'n' in de naam verschilt (n en N).

Vier regels bepalen of een naam überhaupt legaal is:

  1. Het eerste teken moet een letter, een dollarteken of een underscore zijn — nooit een cijfer.
  2. Na het eerste teken zijn letters, cijfers, dollartekens en underscores allemaal toegestaan.
  3. Spaties zijn niet toegestaan, daarom worden twee woorden samengevoegd tot studentNaam in plaats van als twee aparte woorden te worden weergegeven.
  4. Gereserveerde woorden zoals var, let, const, class en return kunnen niet opnieuw als namen worden gebruikt.

Volgens de conventie JavaScriptnamen gebruiken camelCase, dus het eerste woord is een kleine letter en elk volgend woord begint met een hoofdletter: firstName, totalPrice, isLoggedIn.

Het onderstaande script declareert twee variabelen, past de vijf rekenkundige bewerkingen erop toe en schrijft elk resultaat naar de pagina. Probeer het zelf:

<html>
<head>
<title>Variables!!!</title>
<script type="text/javascript">
var one = 22;
var two = 3;
var add = one + two;
var minus = one - two;
var multiply = one * two;
var divide = one/two;
	document.write("First No: = " + one + "<br />Second No: = " + two + " <br />");
	document.write(one + " + " + two + " = " + add + "<br/>");
	document.write(one + " - " + two + " = " + minus + "<br/>");
	document.write(one + " * " + two + " = " + multiply + "<br/>");
	document.write(one + " / " + two + " = " + divide + "<br/>");
</script>
</head>
<body>
</body>
</html>

var vs let vs const in Modern JavaScript

Alleen var bestond toen JavaHet `script`-type werd oorspronkelijk geschreven en heeft twee eigenschappen die beginners verrassen: het kan stilzwijgend opnieuw worden gedeclareerd en het negeert blokgrenzen. `let` en `const` werden toegevoegd om beide problemen op te lossen. De onderstaande tabel toont de drie sleutelwoorden naast elkaar.

Gedrag var laten const
strekking Volledige functie Omhullend blok Omhullend blok
Kan opnieuw worden toegewezen Ja Ja Nee
Kan binnen hetzelfde bereik opnieuw worden gedeclareerd Ja Nee Nee
Vereiste waarde op de declaratieregel Nee Nee Ja
Lees dit voordat u het bekendmaakt. Retourneert undefined Referentiefout Referentiefout

Een simpele gewoonte is in bijna alle gevallen van toepassing: pak const schakel eerst over naar laten het moment waarop een waarde daadwerkelijk moet veranderen, zoals een teller in een van de JavaScriptlussenEn bewaar de variabele voor het lezen van oude code in plaats van het schrijven van nieuwe code.

Variabele reikwijdte en hijswerkzaamheden JavaScript

De scope bepaalt welke delen van een script een variabele kunnen zien. Een `var`-declaratie behoort tot de functie waarin deze voorkomt, waardoor deze niet zichtbaar is binnen een `if`- of `for`-blok in die functie. Een `let`- of `const`-declaratie behoort tot de accolades waartussen deze staat en is daarbuiten niet zichtbaar.

function demo() {
  if (true) {
    var wide = "visible throughout demo()";
    let narrow = "visible only inside these braces";
  }
  console.log(wide);
  console.log(narrow);
}

De eerste `console.log` print de tekenreeks. De tweede geeft een `ReferenceError`, omdat `narrow` niet meer bestaat zodra het `if`-blok eindigt.

Hijsen is de tweede helft van het verhaal. JavaEen script registreert elke declaratie binnen een scope voordat er ook maar één regel van die scope wordt uitgevoerd. Een variabele naam wordt geregistreerd en ingesteld op `undefined`, waardoor het vroegtijdig lezen ervan weliswaar is toegestaan, maar nutteloos. Een `let` of `const` naam wordt geregistreerd zonder waarde, en de ruimte tussen het begin van het blok en de declaratieregel wordt de `open` genoemd. tijdelijke dode zone.

console.log(a);
var a = 1;

console.log(b);
let b = 2;

De eerste regel print 'undefined'. De derde regel stopt met "Cannot access 'b' before initialization" — de fout die 'let' veiliger maakt dan 'var', omdat het de werkelijke fout aanwijst in plaats van deze te verbergen.

Veelvoorkomende fouten bij het declareren JavaScriptvariabelen

Vijf berichten vormen het grootste deel van de console-uitvoer die beginners zien tijdens het leren over variabelen. Elk bericht benoemt een specifieke oorzaak, dus de oplossing bestaat meestal uit één enkele regel code.

Consolebericht Veroorzaken Bepalen
SyntaxError: Identifier 'x' has already been declared `let` of `const` wordt twee keer gebruikt voor dezelfde naam in één blok. Hergebruik de bestaande variabele of hernoem de tweede.
TypeError: toewijzing aan constante variabele Aan een constante werd een nieuwe waarde toegekend. Declareer het met `let` als de waarde moet veranderen.
ReferenceError: Kan 'x' niet benaderen vóór initialisatie Een `let` of `const` werd gelezen binnen de tijdelijke dode zone. Verplaats de leesopdracht naar beneden, onder de declaratieregel.
ReferenceError: x is not defined De naam is nooit officieel bekendgemaakt, of er is een spelfout gemaakt. Geef het aan, of corrigeer de spelling en het hoofdlettergebruik.
'undefined' verschijnt waar een waarde werd verwacht. De variabele is gedeclareerd, maar er is nooit een waarde aan toegekend. Wijs een waarde toe vóór de eerste leesbewerking.

Door "use strict" bovenaan een bestand toe te voegen, wordt de stille versie van het vierde geval — het toewijzen aan een naam die nooit is gedeclareerd — een zichtbare fout. Daarom hoort dit in elk nieuw script thuis. Dezelfde variabele regels blijven ongewijzigd van kracht. arrays, objectenen server-side code geschreven voor Node.js.

Veelgestelde vragen

Eén van hen. JavaScript is dynamisch getypeerd, dus een variabele kan eerst een getal, dan een tekenreeks en vervolgens een object bevatten. De declaratie reserveert een naam, geen type. Gebruik `typeof` om te controleren wat een variabele op een bepaald moment bevat.

JavaHet script maakt een impliciete globale variabele aan, die door andere code per ongeluk kan worden overschreven. Door "use strict" bovenaan het bestand toe te voegen, wordt dezelfde regel omgezet in een ReferenceError, waardoor de fout direct zichtbaar wordt in plaats van zich ongemerkt te verspreiden.

'undefined' betekent dat de variabele is gedeclareerd maar er nooit een waarde aan is toegekend. 'null' is een waarde die je opzettelijk toewijst om aan te geven dat er niets is. Beide zijn onwaar, maar 'typeof undefined' retourneert 'undefined', terwijl 'typeof null' 'object' retourneert.

De plusoperator voegt tekst samen wanneer een van beide zijden een tekenreeks is, dus 22 + “3” levert “223” op. Converteer eerst met Number() of parseInt() wanneer rekenkundige bewerkingen bedoeld zijn. Subtrac'tion' heeft geen tekstuele betekenis, dus "3" − 1 geeft correct 2 terug.

Ja. `const` vergrendelt de binding, niet de waarde, dus eigenschappen van een `const` object en elementen van een `const` array kunnen nog steeds veranderen. Het opnieuw toewijzen van de waarde aan de variabele zelf geeft een `TypeError`. Gebruik `Object.freeze()` wanneer de inhoud vast moet blijven staan.

AI-assistenten die in moderne editors zijn ingebouwd, stellen een trefwoord en een beschrijvende naam voor op basis van de omringende context, markeren een variabele die constant moet zijn en hernoemen elk gebruik in één stap. Beschouw elke suggestie als een concept en controleer of de scope correct is.

Vaak wel. Copilot Het leest de code in de omgeving en biedt namen aan die overeenkomen met de omringende stijl, wat helpt bij het vervangen van plaatsaanduidingen zoals x of temp. RevBekijk elke naam, want een vlotte suggestie kan nog steeds het verkeerde beschrijven.

`console.log()` print de huidige waarde naar de browserconsole. Voor een beter beeld kunt u een breakpoint instellen in het paneel 'Bronnen' van de ontwikkelaarstools en de muis over de naam bewegen, of de regel toevoegen aan de lijst 'Volgen', om de waarde op die exacte regel te lezen.

Vat dit bericht samen met: