JavaScript-skolan Operatorer

1. Inledning

På de tidigare sidorna har jag här och var nämnt termen "operator". Vi har också sett exempel på operatorer, bl.a likamed, plus och minus. Här tänker jag berätta mer om vad operatorer är.

2. Allmänt om operatorer

I följande sats förekommer operatorn "lika med":

var Namn = "Jonas";

Man säger här att operatorn binder samman två uttryck eller delar av uttryck. De delar som operatorn opererar eller verkar på kallas operander. I satsen är alltså "Namn" och "Jonas" operander.

Operatorn brukar skrivas med mellanrum mellan operanderna. Man skriver alltså inte Namn="Jonas".

En operator behöver inte ha två operander, som vi skall se senare, men oftast finns det två.

3. Matematiska operatorer

Denna typ av operatorer kallas ibland även aritmetiska, eftersom de innehåller de fyra räknesätten:

Det är väl egentligen bara modulus som behöver en förklaring. Den kallas ibland även "restoperator" eftersom den beräknar resten. I exemplet är resten det som blir över då det vänstra talet (15) dividerats med det högra (2). 2 går nämligen 7 gånger i 15 och sedan blir det 1 kvar.

Om vi utgår från exemplen på förra sidan kan man använda dessa operatorer så här:

<script language="JavaScript">
<!--
var a = 2, b = 4;
alert(a + b);
alert(a - b);
alert(a / b);
alert(a * b);
alert(b % a);
-->
</script>

Titta på exemplet i praktiken >

4. Relationsoperatorer

Denna kategori kallas även jämförelseoperatorer eftersom de används för att jämföra värden med varandra.

Observera att == används för att jämföra två värden. Enkelt likamed, alltså =, används ju i stället för att tilldela en variabel ett värde. Se vidare i avsnitt 7.

Operanderna måste här självklart vara jämförbara, så man kan inte skriva 3=="tre" eller "3"==3.

Hur använder man då dessa operatorer? Jo, så här:

<script language="JavaScript">
<!--
var a = 2, b = 4, c = 8;
alert(b < c);
alert(b > a);
alert(b <= c - a);
alert(c >= b + a);
alert(a == 2);
alert(a * b != c);
-->
</script>

Titta på exemplet i praktiken >

Obs!
Webbläsaren talar här om om påståendet är sant eller falskt.

Som du ser är de första 5 satserna sanna medan det sista är falskt, som bilden här till höger visar.

5. Logiska operatorer

Logiska operatorer är inte helt enkla att förstå, eftersom de fungerar lite annorlunda än övriga operatorer. Dessutom motsvaras de inte alltid av bra svenska ord.

Operatorn NOT skrivs alltså med ett utropstecken. NOT negerar sanningsvärdet hos ett uttryck, dvs om a är sann så är !a falsk.

AND säger att båda uttrycken är sanna. Man använder ofta de logiska operatorerna i samband med datatypen "boolean", dvs då man anger sanningsvärden hos olika uttryck.

OR skrivs med två vertikala streck och talar om att antingen a eller b är sanna. Men detta kan innebära något av följande:

a är sann men b är falsk
b är sann men a är falsk
a är sann och b är sann

Man pratar ibland om de första två som exklusivt eller och den sista som ett inklusivt eller. I JavaScript finns dock (vad jag vet) inga särskilda symboler för dessa specialtyper.

Hur används då de logiska operatorerna? Jo, man kan t.ex kontrollera om en inmatad siffra, t.ex ett personnummer eller postnummer, är rätt inskrivet. man kan också ta reda på om bara siffror är inskriva eller om det har kommit med en bokstav av misstag i ett fält.

De logiska operatorerna återkommer jag till på senare sidor.

6. Ensidiga operatorer

De operatorer som bara har en operand kallar jag ensidiga. De är följande:

Ökningsoperatorn kan också kallas dubbelplus och ökar alltså ett tals värde med ett. Men operatorn kan skrivas på två olika sätt, nämligen före eller efter talet:

Om a = 5 så blir ++a + 3 = 9 eftersom ++a innebär att värdet hos a ökar med 1 till 6 i uttrycket.

Om a = 5 så blir a++ + 3 = 8, men däremot får a därefter värdet 6, vilket gör att a + 3 = 9.

Sätts operatorn alltså före så ökar värdet direkt med ett. Sätts den efter så sker ökningen först då de övriga operatorerna i uttrycket verkställts.

På motsvarande sätt fungerar då minskningsoperatorn:

Om a = 5 så är --a + 3 = 7, eftersom --a minskar a = 5 till a = 4. Däremot är a-- + 3 = 8 eftersom a-- minskar värdet till 4 först efter det att 3 lagts till.

Ensidigt plus används för att omvandla en operand till ett tal, t.ex "3" till 3. Denna användning kommer jag att återkomma till senare.

Ensidigt minus används för att omvandla ett positivt värde till ett negativt och tvärt om, dvs om a = 5 så blir -a = -5. Jag återkommer till denna användning lite längre fram.

Öknings- och minskningsoperatorerna kan användas så här:

<script language="JavaScript">
<!--
var a = 5, b = 2;
alert(++a); // a är nu 6
alert(--a); // a är nu 5
alert(++a + b); // 8 dvs 6 + 2
alert(a++ + --b); // 7 dvs 6 + 1
alert(a + b); // 8 dvs 7 + 1
-->
</script>

Titta på exemplet i praktiken >

7. Tilldelningsoperatorer

Denna typ heter på engelska "assignment operators" och är bekanta både från den här och tidigare sidor.

Man kan använda tilldelningsoperatorn likamed (eller enkelt likamed) på många olika sätt. Man kan t.ex skriva

a = b = c = 5

vilket ger alla variabler samma värde. Denna enkla operator kompletteras i JavaScript med några dubbla:

Dessutom finns en rad andra liknande operatorer, som jag kommer att ta upp på mer avancerade sidor. De jag här har angett saknar bra svenska namn. De används dock så här:

<script language="JavaScript">
<!--
var a = 5;
alert(a += 2); // 7 dvs a = 5 + 2
-->
</script>

Titta på exemplet i praktiken >

8. Villkors-, sträng- och typeof-operatorer

Det finns många fler operatorer än dem jag visat här. Jag kommer att ta upp dem när de är aktuella, eftersom vissa av dem kräver längre förklaringar och är för svåra att förstå just nu.

Jag här endast ta upp tre lite enklare varianter: villkorsoperator, strängoperator och typeof-operator.

Med en villkorsoperator kan man säga sådant som

x = 1, y = 2, z = 3
a = (y < z) ? x : z

Variabeln a tilldelas ett värde beroende på hur villkoret utfaller. Här skall villkoret utläsas: om det är sant att y är mindre än z så skall a ha värdet x, annars skall a ha värdet z.

Villkoret skrivs alltså till vänster om frågetecknet och om det är sant tilldelas variabeln det värde som står till vänster om kolontecknet, men om det är falskt får den det högra värdet.

<script language="JavaScript">
<!--
var a;
var x = 1, y = 2, z = 3;
a = (y < z) ? x : z
alert(a); // a får alltså värdet 1
-->
</script>

Titta på exemplet i praktiken >

Strängoperatorn används för att lägga ihop strängar, enligt en princip som kallas konkatenering, efter engelskans "concatenate". Att konkatenera innebär att man slår samman två värden:

<script language="JavaScript">
<!--
var a = "Jonas", b = " Webresurs";
var c = a + b;
alert(c);
-->
</script>

Titta på exemplet i praktiken >

En typeof-operator gör det möjligt att bestämma vilken slags data som används i en viss variabel eller i ett villkor. Vilka dessa datatyper är kunde du läsa på sidan om satser.

<script language="JavaScript">
<!--
var a = "3", b = 3;
alert(typeof(a));
alert(typeof(b));
-->
</script>

Titta på exemplet i praktiken >

9. Övningar

Övning 1
I scriptet nedan kommer webbläsaren att returnera ett sanningsvärde, "true" eller "false", beroende på om påståendet är sant eller falskt. Vilket svar kommer webbläsaren att ge för de olika alternativen?

<script language="JavaScript">
<!--
var a = 1, b = 2, c = 3;
d = a + b;
e = a + c;
alert(e > d);
alert(5 < e);
alert(e == 4);
alert(d != c);
alert(!d != c);
alert(!d != !c);
-->
</script>

Facit >

Övning 2
Skapa ett enkelt script som uttrycker följande satser:

a eller b är sanna
a är sann men b är falsk
b är sann men a är falsk
a är sann och b är sann

Facit >

Övning 3
Ange summan för satserna nedan:

<script language="JavaScript">
<!--
var a = 5, b = 2;
alert(++a);
alert(--a);
alert(++a + b);
alert(a++ + --b);
alert(a + b);
alert(a++);
alert(--b);
alert(++b + a);
alert(a++ + --b);
alert(a + b);
-->
</script>

Facit >

Övning 4
Beräkna summan hos följande satser:

<script language="JavaScript">
<!--
var a = 1, b = 2, c = 3;
alert(a += 3);
alert(b *= 4);
alert(c /= 3);
var x = 2, y = 3, z = 4;
var d = (y > z) ? x : z;
alert(d);
alert(d += a);
-->
</script>

Facit >

Övning 5
Skapa ett script som anger vilken typ av värde följande variabler har:

a = "3"
b = 4
c = "fem"
d = a

Facit >