JavaSkriptvariabel: Deklarera, tilldela ett värde med exempel
⚡ Smart sammanfattning
JavaSkriptvariabler lagrar värden som namn och siffror, eller resultatet av ett uttryck. Att deklarera en med var, let eller const reserverar en namngiven plats som resten av skriptet kan läsa och uppdatera.
Variabler används för att lagra värden (namn = "John") eller uttryck (summa = x + y). Varje värde som ett skript sparar för senare – ett användarnamn, en löpande summa, en ja-eller-nej-flagga – finns i en variabel, så att deklarera och namnge dem på rätt sätt är den första färdigheten att lära sig. JavaScript.
Deklarera variabler i JavaScript
Innan du använder en variabel måste du först deklarera den. Du måste använda nyckelordet var för att deklarera en variabel så här:
var name;
Deklarationen skapar namnet i sig självt och inget mer. Variabeln existerar nu men har det speciella värdet odefinierat, eftersom inget värde har matats in i den ännu.
⚠️ Versionsnotering: var är det ursprungliga deklarationsnyckelordet och körs fortfarande i alla webbläsare. ES6 (2015) tillagd Låt och const, vilka är nyckelorden modern JavaSkriptanvändning. Båda jämförs mot var längre ner på den här sidan.
Tilldela variabeln ett värde
Du kan tilldela variabeln ett värde antingen när du deklarerar variabeln eller efter att du har deklarerat variabeln.
var name = "John";
OR
var name; name = "John";
Båda formerna slutar med samma resultat. Det enda likhetstecknet är uppdragsoperatör: den kopierar värdet till höger till variabeln till vänster. Det är inte ett test för likhet, vilket skrivs == eller === och hör hemma i villkorade uttalanden.
Namnge variabler
Även om du kan namnge variablerna hur du vill är det en bra programmeringspraxis att ge dem beskrivande och meningsfulla namn. Dessutom bör variabelnamn börja med en bokstav och de är skiftlägeskänsliga. Därför är variablerna studentnamn och studentnamn olika eftersom bokstaven n i namnet är olika (n och N).
Fyra regler avgör om ett namn är lagligt överhuvudtaget:
- Det första tecknet måste vara en bokstav, ett dollartecken eller ett understreck – aldrig en siffra.
- Efter det första tecknet är bokstäver, siffror, dollartecken och understreck tillåtna.
- Mellanslag är inte tillåtna, vilket är anledningen till att en idé med två ord kopplas ihop som studentName istället för att lämnas som två ord.
- Reserverade ord som var, let, const, class och return kan inte återanvändas som namn.
Enligt konvention JavaSkriptnamn använder camelCase, så det första ordet är gemener och varje senare ord börjar med versal: firstName, totalPrice, isLoggedIn.
Skriptet nedan deklarerar två variabler, tillämpar de fem aritmetiska operatorerna på dem och skriver varje resultat till sidan. Prova detta själv:
<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 i Modern JavaScript
Endast var existerade när JavaSkriptet skrevs först, och det har två vanor som överraskar nybörjare: det kan omdeklareras tyst, och det ignorerar blockgränser. let och const lades till för att åtgärda båda. Tabellen nedan visar de tre nyckelorden sida vid sida.
| Beteende | var | Låt | const |
|---|---|---|---|
| Omfattning | Hela funktionen | Omslutande block | Omslutande block |
| Kan omtilldelas | Ja | Ja | Nej |
| Kan deklareras på nytt inom samma omfattning | Ja | Nej | Nej |
| Värde som krävs på deklarationsraden | Nej | Nej | Ja |
| Läs innan dess deklaration | Returer odefinierade | Referensfel | Referensfel |
En enkel vana täcker nästan alla fall: sträck dig efter const först, byt till Låt i det ögonblick då ett värde verkligen måste ändras, till exempel en räknare inuti en av JavaSkriptloopar, och behåll var för att läsa gammal kod istället för att skriva ny kod.
Variabelt omfång och lyftning in JavaScript
Scope avgör vilka delar av ett skript som kan se en variabel. En var-deklaration tillhör funktionen som innehåller den, så den escapear alla if-block eller for-block inuti den funktionen. En let- eller const-deklaration tillhör det par av klammerparenteser den sitter i och försvinner utanför dem.
function demo() { if (true) { var wide = "visible throughout demo()"; let narrow = "visible only inside these braces"; } console.log(wide); console.log(narrow); }
Den första console.log-funktionen skriver ut sin sträng. Den andra genererar ett ReferenceError, eftersom narrow inte längre existerar när if-blocket slutar.
lyft är andra halvan av berättelsen. JavaSkriptet registrerar varje deklaration i ett scope innan det kör en enda rad i det scopet. Ett variabelnamn registreras och sätts till odefinierat, så det är lagligt men värdelöst att läsa det tidigt. Ett let- eller const-namn registreras utan värde, och mellanrummet mellan blockets topp och deklarationsraden kallas temporal död zon.
console.log(a); var a = 1; console.log(b); let b = 2;
Den första raden skriver ut odefinierad. Den tredje raden slutar med "Kan inte komma åt 'b' före initialisering" — felet som gör let säkrare än var, eftersom det pekar på det verkliga felet istället för att dölja det.
Vanliga fel vid deklaration JavaSkriptvariabler
Fem meddelanden står för det mesta av konsolutdata som nybörjare ser när de lär sig variabler. Var och en anger en specifik orsak, så lösningen är vanligtvis en enda rad.
| Konsolmeddelande | Orsak | Fast |
|---|---|---|
| SyntaxError: Identifieraren 'x' har redan deklarerats | let eller const används två gånger för samma namn i ett block | Återanvänd den befintliga variabeln eller byt namn på den andra |
| TypeError: Tilldelning till konstant variabel | En konstant fick ett nytt värde | Deklarera det med let om värdet måste ändras |
| Referensfel: Kan inte komma åt 'x' före initialisering | En let eller const lästes inuti den temporala dödzonen | Flytta läsningen under deklarationsraden |
| Referensfel: x är inte definierat | Namnet angavs aldrig, eller så stavades det fel | Förklara det, eller korrigera stavningen och skiftläge |
| odefinierad visas där ett värde förväntades | Variabeln deklarerades men tilldelades aldrig | Tilldela ett värde före den första avläsningen |
Att lägga till "use strict" högst upp i en fil gör den tysta versionen av det fjärde fallet – att tilldela ett namn som aldrig deklarerades – till ett synligt fel, vilket är anledningen till att det hör hemma i varje nytt skript. Samma variabla regler överförs oförändrade till arrayer, objektoch serverkod skriven för node.js.
