En variabel är ju någonting som kan stå för olika, föränderliga värden. Med ett annat sätt att uttrycka sig representerar variabeln variabel data. Begreppet känner du igen från matematiken, där x kan stå för olika siffror beroende på sammanhanget. På samma sätt fungerar det i programmering, med den skillnaden att du förväntas hitta på dina egna namn på variabler.

Tilldelning (assignment)

För att göra en variabel du kan använda behöver du tilldela variabeln data, på engelska kallas denna tilldelning assignment. I exemplet nedan kommer jag ge varibeln humoer värdet "grinig" och variabeln aalder värdet 42. Tänk på att du inte kan använda ÅÄÖ i variabelnamnen.

Skrivet som korrekt JavaScript kommer det se ut så här:

humoer = "grinig";
aalder = 42;

När variabeln har tilldelats data, säger man att den innehåller denna data.

När variablerna nu innehåller dessa data kan du använda dessa, till exempel som popupfönster på samma sätt som du gjorde tidigare (klicka på texten för att se hur det ser ut):

alert(humoer);
alert(aalder);

(För att få texten ovan att köra funktionen alert() vid klick har jag använt mig av HTML-taggen <span> med händelseattributet onclick, alltså: <span onclick="alert(humoer)">alert(humoer);</span>)

Deklarera variabler

Vissa programmeringsspråk kräver att du talar om namnen på dina variabler separat för att de ska fungera, detta kallas att deklarera variablerna. JavaScript är inte så noga med detta, även om jag inte talar om att en variabel är en variabel såp kommer webbläsaren anta det, vilket innebär att det som står ovan faktiskt kommer fungera. Det anses ändå som god praxis att deklarera sina variabler även i JavaScript. För att deklarera variablerna ovan kan man i sitt skript skriva:

var humoer;
var aalder;

var humoer, aalder;

För att ytterligare spara in på skrivandet kan du passa på tilldela variablerna sina värden samtidigt som du deklarerar dem:

var humoer = "grinig";
var aalder = 42;

var humoer = "grinig", aalder = 42;

var humoer;
var aalder;
humoer = "grinig";
aalder = 42;

Namn på variabler

JavaScript skiljer på stora och små bokstäver, det innebär att humoer är ett annat namn är Humoer, HUMOER eller HuMoEr. Du kan inte använda namn med mellanslag eller andra tecken än de som finns i det engelska alfabetet plus siffror. Punkttecken, komman och liknande får inte förekomma i namnen, däremot kan du använda understreck (_) och dollartecken ($).

Fortsätt läsa om Datatyper i JavaScript

I exemplet med variablerna tilldelades variablerna humoer och aalder data. I det ena fallet var det en ålder, skrivet som ett matematisk tal (ett numeriskt värde), i det andra fallet var det ett ord, en textsträng.

JavaScript accepterar tre olika typer av data: textsträngar (strings), Numeriska data (siffror, numbers), samt booleska värden (Boolean values). Olika regler gäller för de olika datatyperna.

vissa programmeringsspråk skiljer noga på vilka datatyper som tilldelas vilka variabler, JavaScript är inte noga med detta, vilken variabel som helst kan innehålla vilken datatyp som helst.

Textsträngar

Textsträngar kan beskrivas som ett eller flera tecken som kan läsas, för att en textstäng ska förstås som en sådan innesluts den i citationstecken. Citationstecknen kan vara vanliga dubbla (") eller enkla ('), vilka du väljer spelar ingen roll för skriptets funktion. Det kan dock spela roll för kodens läsbarhet. Du kan hamna i situationer när det blir svårt att hålla reda på vilka citationstecken som hänger ihop med vilka, då är det bra att ha två varianter för att kunna hålla reda på dem.

var humoer = "grinig";

var humoer = 'grinig';

Om vi tar ett exempel som:

var smeknamn = "De kallar mig "Norpan"!";

var smeknamn = 'De kallar mig "Norpan"!';

En textsträng kan innehålla de flesta tecken du kan skriva, inklusive mellanslag och annat. Du skriver alltså, med några undantag, som du skulle skriva i normala fall när du skriver en text.

Precis som i HTML finns det dock tecken som inte kan användas i textsträngar eftersom de har en funktion i JavaScript. Citationstecknen i "Norpan" ovan är ett exempel.

I JavaScript är det ftramför allt tre tecken som innebär problem, dessa är ", ' och \ (bakvänt snedstreck, backslash).

Escaping

För att ändå kunna använda sig av dessa tecken kan man skapa undantag, på engelska kallas detta för escaping

Genom att sätta ett bakvänt snedstreck, backslash framför tecknet så kommer det visas exakt som det står och inte påverka skriptet i övrigt:

var smeknamn = 'De kallar mig \"Norpan\"!';

I detta sammanhang kallas ofta det bakåtlutade snedstrecket escapetecken eller undantagstecken. Kombinationen av \-tecknet och tecknet som ska escapeas kallas för en escapesekvens (ibland "undantagssekvens).

Det finns också speciella escapesekvenser som lägger till saker som radbrytningar, tabbar och annat:

Numeriska värden

Siffror som ska användas som sådana skrivs inte inom citationstecken. Att jag här använder begreppet numeriska värden beror på att du ju faktiskt kan använda sifror i en textsträng också. Du kan dock inte använda textsträngar i matematiska operationer.

var aalder = 42;


var aalder = "42";


Du kan använda dig av positiva såväl som negativa tal (med minustecken före),

-42

42

42.333333

-42.333333

Som du ser kan du dock inte använda dig av decimalkomma, som du normalt gör, utan måste använda punkt där du normalt skulle sätta ett komma.

Booleska värden

Booleska värden kan ha ett av två möjliga värden:

true

false

Ett exempel skulle kunna vara en variabel som handlar om huruvida någon är närvarande på en lektion:

var naervarande = true;

Precis som med de numeriska värdena gäller det att undvika citationstecknen

var naervarande = true;

var naervarande = "true";

Kommentarer i JavaScript kan skrivas på mer än ett sätt. Det vanligaste är två snedstreck, //. Två snedstreck kommer att förvandla efterföljande text på en rad till en kommentar. Observera att // bara gäller för en rad. Vill man göra en kommentar som spänner över flera rader gör man som i CSS, man inleder kommentaren med /* och avslutar den med */

Det går också att använda <!--, som i HTML, men det fungerar också bara för en rad, och ska ine avslutas som i HTML. Detta är ju både överflödigt och mer krångligt än att bara göra //, som gör exakt samma sak.

Enradskommentar:

//

Flerradig kommentar:

/* */

(Alternativ enradskommentar

<!-- )