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.

  • 🔘 Deklaration: Nyckelordet var, let eller const skapar namnet innan någon kodrad läser eller skriver det.
  • ☑️ Uppdrag: Ett enda likhetstecken kopierar ett värde till variabeln, antingen på deklarationsraden eller senare.
  • ✅ Namngivning: Namn börjar med en bokstav, ett dollartecken eller ett understreck, och stora och små bokstäver räknas som olika.
  • 🧪 Moderna nyckelord: const passar värden som aldrig ändras, let passar värden som gör det, och var överlever huvudsakligen i äldre skript.
  • 🛠️ Omfattning: låt och const stanna innanför sina omslutande klammerparenteser, medan var når hela den omgivande funktionen.
  • 📌 Vanliga fel: Att omtilldela en konstant, läsa en let för tidigt eller utelämna nyckelordet ger alla upphov till ett distinkt fel.

Förklara a JavaSkriptvariabel och tilldelning av ett värde till den

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:

  1. Det första tecknet måste vara en bokstav, ett dollartecken eller ett understreck – aldrig en siffra.
  2. Efter det första tecknet är bokstäver, siffror, dollartecken och understreck tillåtna.
  3. 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.
  4. 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.

Vanliga frågor

Vilken som helst. JavaSkript är dynamiskt typat, så en variabel kan innehålla ett tal, sedan en sträng och sedan ett objekt. Deklarationen reserverar ett namn, inte en typ. Använd typeof för att kontrollera vad en variabel innehåller när som helst.

JavaSkriptet skapar en implicit global variabel, som annan kod kan skriva över av misstag. Om du lägger till "use strict" högst upp i filen förvandlas samma rad till ett ReferenceError, så att felet visas omedelbart istället för att spridas tyst.

odefinierad betyder att variabeln deklarerades men aldrig fick ett värde. null är ett värde som du avsiktligt tilldelar för att betyda "ingenting här". Båda är falska, men typeof odefinierad returnerar "odefinierad" medan typeof null returnerar "objekt".

Plusoperatorn kopplar samman text när någon av sidorna är en sträng, så 22 + "3" ger "223". Konvertera först med Number() eller parseInt() när aritmetik är avsedd.traction har ingen textbetydelse, så “3” − 1 returnerar korrekt 2.

Ja. const låser bindningen, inte värdet, så egenskaperna för ett const-objekt och elementen i en const-array kan fortfarande ändras. Att omtilldela själva variabeln utlöser ett TypeError. Använd Object.freeze() när innehållet måste förbli fast.

AI-assistenter inbyggda i moderna redigerare föreslår ett nyckelord och ett beskrivande namn utifrån det omgivande sammanhanget, flaggar en variabel som ska vara const och byter namn på varje användning i ett steg. Behandla varje förslag som ett utkast och bekräfta att omfattningen är korrekt.

Ofta, ja. Copilot läser kod i närheten och erbjuder namn som matchar den omgivande stilen, vilket hjälper till att ersätta platshållare som x eller temp. Revse varje namn, eftersom ett flytande förslag fortfarande kan beskriva fel sak.

console.log() skriver ut det aktuella värdet till webbläsarkonsolen. För en närmare titt, ange en brytpunkt i panelen Källor i DevTools och håll muspekaren över namnet, eller lägg till det i bevakningslistan, för att läsa värdet på exakt den raden.

Sammanfatta detta inlägg med: