JavaScript

Kohteesta Wikikirjasto
Loikkaa: valikkoon, hakuun
PD
Huomio: Tämä kirja on lisensoitu public domain - eli PD-lisenssillä. Muokatessasi tätä sivua lisensoit muokkauksesi tällä lisenssillä. Mikäli et halua tai voi hyväksyä lisenssiä älä muokkaa sivua. Lisätietoja on sivulla Wikikirjasto:Tekijänoikeudet.
Tämä kirja perustuu ECMAn suositukseen ECMAScript Language Specification 3rd edition (200-07-19)
Lisäksi käytetään Mozillan virallista JavaScript-dokumentaatiota.

Wikipedia
Wikipedia-tietosanakirjassa on artikkeli aiheesta:

JavaScript (tästä eteenpäin JS) on yleinen komentosarja- eli skriptikieli. Sitä käytetään erityisesti WWWssä. JavaScript on laajennettu versio ECMAn standardoimasta ECMAScript-nimisestä komentosarjakielestä.

Ominaispiirteitä[muokkaa]

JS oliopohjainen komentokieli. JS-tiedostoa kutsutaan skriptiksi, koska sen koodia ei erikseen käännetä (compilation) omaksi ohjelmakseen ennen suorittamista vaan se tulkintaan (interpretation). JS tarvitsee toimiakseen isäntäympäristön, jonka JS-tulkki suorittaa koodin rivi kerrallaan. JS:n on käyttöjärjestelmäriippumattomaton ja sen syntaksi on varsin yksinkertainen ja vapaamuotoinen.

Käyttö[muokkaa]

Tyypillinen käyttökohde on toiminnallisuuden lisääminen HTML-sivuihin. Tällöin isäntäohjelma on WWW-selain (tästedes puhutaan selaimesta). JS:llä tehdään lähinnä selainskriptejä (client-side scripting), ei juurikaan palvelinskriptejä (server-side scripting).

Perussääntöjä[muokkaa]

  • Se mikä voidaan tehdä merkkauskielellä tulisi tehdä merkkauskielellä.
  • JS on case-sensitive eli a on eri asia kuin A.
  • JS ohittaa ylimääräiset välilyönnit:
nimi="Herne";
nimi = "Herne";
toimivat identtisesti.

Kommentointi[muokkaa]

JS-tulkki ohittaa kaikki kommentit. Kommentoinnilla voidaan estää siten myös koodin toimintaan. Yksirivinen kommentti alkaa kahdella kauttaviivalla (//) ja päättyy automaattisesti rivin loppuun.

//yksirivinen kommentti

yksirivinen kommentti voidaan lisätä myös koodia sisältävän rivin loppuun:

window.alert('Hei maailma!'); //yksirivinen kommentti

Monirivinen kommentti sijoitetaan kauttaviiva-asteriski ja asteriski-kauttaviiva (/* ja */) -merkkiyhdistelmien väliin.

/* Monirivinen kommentti alkaa
   kauttaviiva-asteriski -yhdistelmällä ja
   päättyy asteriski-kauttaviiva -yhdistelmään.  */
/*************************************
 * Tälläisellä lisämuotoilulla voidaan
 * helpottaa kommenttien lukemista
 * ja nostaa esille tärkeitä tietoja.
 *************************************/

JSn lisääminen XHTML-tiedostoon[muokkaa]

Skriptejä voidaan sijoittaa joko head- tai body-elementtiin tai molempiin.

Linkittämällä ulkoinen js-tiedosto[muokkaa]

<script
 type="text/javascript"
 charset="iso-8859-1"
 src="javaskripti.js">
</script>

missä

<script 
avaa skriptien tuontiin tarkoitetun script-elementin
type="text/javascript" 
määrittelee tuotavaksi JS-skriptin
charset="iso-8859-1"
määrittelee skriptin merkistöksi iso-8859-1:n
src="heips.js" 
määrittää JS-skriptin sijainnin ja nimen

Elementille ei anneta sisältöä.

</script> 
sulkee skriptin tuonnin

Upottamalla JS-koodin XHTML-tiedostoon[muokkaa]

<script type="text/javascript" xml:space="preserve">
//<![CDATA[ merkataan koodi XHTML-yhteensopivaksi

window.alert('Hei maailma!');

// CDATA-merkintä loppuu!]]>
</script>

missä:

<script type="text/javascript" xml:space="preserve">
avaa skriptin. Pakollinen type-attribuutti määrittelee tässä annettavaksi JS-skriptin. xml:space-attribuutin arvo "preserve" pyytää XML-ohjelmia säilyttämään koodissa tyhjän tilan.
//<![CDATA[
merkitsee skripti-koodin XHTML-yhteensopivaksi
window.alert('Hei maailma!');
on yksinkertainen JS-ohjelma ja

window.alert

on eräs yksittäinen JS-komento
// !]]>
CDATA-merkintä loppuu
</script>
päättää skriptin

Upottamalla koodi tapahtuma-attribuuttiin[muokkaa]

<p onclick="window.alert('Hei maailma!');">
Tämä on esimerkkikoodi elementistä,
johon on yhdistetty tapahtuma-attribuutti.</p>
<p onclick="window.alert('Hei maailma!');"> 
aloittaa p-elementin ja määrittelee sille toiminta-attribuutin onclick ja toiminta-attribuutille JS-koodin window.alert('Hei maailma!'); suoritettavaksi

Perustietotyypit[muokkaa]

Luvut[muokkaa]

Luvut (numbers) merkitään koodiin sellaisenaan. Kaikki luvut ovat IEEE-754 -standardin mukaisia liukulukuja.

Merkkijono[muokkaa]

Merkkijono (string) on kirjaimia sisältävä merkkirimpsu tai sellaiseksi merkitty numerorimpsu. Se merkitään lainausmerkeillä.

"Tämä on merkkijono." 
teksti merkkijonona
"2" 
numerokin voidaan merkitä merkkijonoksi
""  
tyhjä merkkijono (zero-length string)
'merkkijono' 
myös heittomerkkejä voidaan käyttää

Merkkijonoa voidaan käsitellä osin taulukkona eli sen kutakin merkkiä indeksoituna elementtinä käyttäen charAt() -metodilla.

var puuttuja = "Painos"; // määritellään puuttuja-muuttuja ja annetaan sille arvoksi Painos
var kirjain = puuttuja.charAt(0); // määritellään muuttuja kirjain ja annetaan sille arvoksi puuttuja-muuttujan 0. kirjain eli P

Muokkaaminen ei kuitenkaan ole mahdollista merkki kerrallaan.

Totuusarvot[muokkaa]

Totuusarvoja (Boolean) käytetään vertailuoperaattoreissa. Niitä on kaksi:

true
tosi
false
epätosi

null[muokkaa]

Arvo on "tyhjä".

undefined[muokkaa]

Arvo on "määrittelemätön".

Taulukko[muokkaa]

Taulukko (array) on tietorakenne, jossa on useita muuttujia indeksoituna eli se on kokoelma muuttujia. JSssä indeksointi alkaa nollasta ja sitä seuraa 1 jne. Indeksinä voidaan käyttää myös tekstiä. Taulukko on myös olio.

Taulukkoon viittaaminen[muokkaa]

Taulukon yksittäiseen muuttujaan viitataan seuraavasti:

taulukko[0]; // viittaus 0. indeksiin
// tai
taulukko["teksti"]; viittaus nimettyyn indeksiin

Taulukon määrittely[muokkaa]

Taulukon määrittelyssä muuttujan arvoksi annetaan array-olion instanssi. Taulukon määrittelyyn on useita tapoja:

//new-avainsanalla
var taulukko = new Array(arvo0,arvo1,arvo2,arvo3); // taulukko, jonka pituus on 4 ja jossa on 4 muuttujaa
//new-avainsanalla tyhjä taulukko
var taulukko = new Array(4);         // tyhjä taulukko, jonka pituus on 4
//new-avainsanalla muuttuja kerralla
var mycars=new Array(3); 
mycars[0]="arvo0";
mycars[1]="arvo1";
mycars[2]="arvo2";
mycars[3]="arvo3";
// []-notaatiolla
var taulukko = [arvo0,arvo1,arvo2,arvo3]

Jos muuttuja jätetään määrittelemättä se saa arvoksi undefined.

// []-notaatiolla
var taulukko = [arvo0,,arvo2,arvo3] //1. muuttuja saa arvoksi <code>undefined</code>

Vain määritellyt alkiot käyttävät muistia. Antamalla taulukko[10] = 'jotain' ja taulukko[57] = 'jotainmuuta' käyttää muistia vain näille kahdelle elementille, vaikka taulukon pituus on silti 58.

Taulukko voidaan määritellä myös teksti-indekseillä, jolloin kyseessä on w:assosiaatiotaulu.

var koira = {"vari":"ruskea", "koko":"suuri"};
koira["vari"]; // antaa arvoksi "ruskea"

Taulukkoon voi määritellä myös moniulotteista dataa.

var kissat = [{"vari":"ruskea", "koko":"suuri"}, // 0. indeksi
        {"vari":"black", "koko":"pieni"}]; 1. indeksi
var kissat[0]["koko"]; // antaa arvoksi "suuri"

koirat = {"rover":{"vari":"ruskea", "koko":"suuri"}, // rover-indeksi
        "spot":{"vari":"black", "koko":"pieni"}}; // spot-indeksi
koirat["spot"]["koko"]; // antaa arvoksi "pieni"

Olio[muokkaa]

Olio (object) on rakenne, joka muodostuu ominaisuuksista (properties) ja metodeista (methods).

Ominaisuus on olioon liittyvä yksinkertainen muuttuja tai toinen olio.

var teksti="Hei maailma!"; // määritellään muuttujalle teksti arvoksi merkkijono-olio Hei maailma!
document.write(teksti.length); // tulostetaan teksti-muuttujan merkkijono-olion pituus

Edellisen tulos olisi 12.

Metodi on oliolle suoritettava funktio.

var teksti="Hei maailma!"; // määritellään muuttujalle teksti arvoksi merkkijono-olio Hei maailma!
document.write(teksti.toUpperCase()); //tulostetaan teksti-muuttujan arvo merkkijono-olio versaaliksi

Tulos olisi HEI MAAILMA!

Perusolioita[muokkaa]

JSn valmiiksi määriteltyjä perusolioita ovat:

String 
merkkijono
Date 
päiväys
Array 
taulukko
Boolean 
totuusarvo
Math 
mahdollistaa peruslaskentaoperaatioita
ei tarvitse määritellä ennen käyttöä
RegExp 
määrittää mitä etsitään tekstistä

Olion käyttäminen[muokkaa]

Olion yksittäiseen ominaisuuteen viitataan seuraavasti:

olio.ominaisuus

Olion yksittäiseen ominaisuuteen asetataan arvo ja jos ominaisuutta ei aiemmin ollut samalla luodaan olioon uusi ominaisuus seuraavasti:

olio.ominaisuus = arvo;

Oliota voi käsitellä myös taulukkona, jolloin ominaisuuteen asetettaisiin arvo seuraavasti:

olio["ominaisuus"] = "arvo";

Olion määrittely[muokkaa]

Ominaisuuden määrittely[muokkaa]

Oliomäärittelyllä (Initialiser) oliolle annetaan määrittelyn yhteydessä myös arvot:

henkilo = { etunimi:"Matti", sukunimi:"Meikäläinen",
          osoite:{ katuosoite:"Kuja 1", postinumero:12345 } }

henkilo on määriteltävä olio, etunimi, sukunimi ovat ominaisuuksia ja niillä on arvot "Matti" ja "Meikäläinen". osoite on henkilo-olion aliolio ja sillä on ominaisuudet katuosoite ja postinumero, ja niillä on arvot "Kuja 1" ja 12345.

Rakenninfunktiolla (constructor function) luodaan ensin olio, jolle sitten luodaan yksittäisiä intansseja (instance). Instanssi luodaan avainsanalla new.

// osoitteen rakenninfunktio
function osoite(katuosoite, postinumero) {
  this.katuosoite = katuosoite;
  this.postinumero = postinumero;
}
 
// henkilön rakenninfunktio
function henkilo(etunimi, sukunimi, osoite) {
  this.etunimi = etunimi;
  this.sukunimi = sukunimi;
  this.osoite = osoite;
}
 
// määritellään instanssi osoite-oliolle
var meikalainen_osoite = new osoite("Kuja 1", 12345);
// määritellään instanssi henkilo, jossa käytetään myös instanssia meikalainen_osoite
var matti = new henkilo("Matti", "Meikäläinen", meikalainen_osoite);
var teija = new henkilo("Teija", "Meikäläinen o.s. Teikäläinen", meikalainen_osoite); /*samalle oliolle voidaan nyt
luoda useampia instansseja*/

Metodin määrittely[muokkaa]

Metodi asetetaan oliolle tarkalleen samalla syntaksilla kuin ominaisuuskin. Aluksi määritellään metodin toteuttava funktio. Metodi sijoitetaan sitten olioon joko suoraan tai rakentimen sisällä. Avainsana this ilmoittaa että kyseessä on olion ominaisuus ei pelkästään kyseisen funktion muuttuja.

Luodaan metodeina käytettävät funktiot:

// henkilo-olion muuntaminen yhdeksi merkkijonoksi
function henkilo_merkkijonoksi() {
  var henkilo = this.etunimi + " " + this.sukunimi;
  return henkilo;
}
// osoite-olion muuntaminen yhdeksi merkkijonoksi
function osoite_merkkijonoksi() {
  var osoite = this.katuosoite + ", " + this.postinumero;
  return osoite;
}

Luodaan oliot:

// osoitteen rakenninfunktio
function osoite(katuosoite, postinumero) {
  this.katuosoite = katuosoite;
  this.postinumero = postinumero;
  this.merkkijonoksi = osoite_merkkijonoksi; // metodin sijoitus olioon
}
// henkilön rakenninfunktio
function henkilo(etunimi, sukunimi, osoite) {
  this.etunimi = etunimi;
  this.sukunimi = sukunimi;
  this.osoite = osoite;
  this.merkkijonoksi = henkilo_merkkijonoksi; // metodin sijoitus olioon
}

Instassien määrittely:

// määritellään instanssi osoite-oliolle
var meikalainen_osoite = new osoite("Kuja 1", 12345);
// määritellään instanssi matti, jossa käytetään myös instanssia meikalainen_osoite
var matti = new henkilo("Matti", "Meikäläinen", meikalainen_osoite);

Metodin käyttöesimerkkki:

document.write(matti.merkkijonoksi() + "<br />" + matti.osoite.merkkijonoksi());

tuottaisi

Matti Meikäläinen
Kuja 1, 12345

Olion tuhoaminen[muokkaa]

Olio tuhotaan avainsanalla delete:

delete olio;

Tuhoaminen jättää jälkeen muuttujan olio, jonka arvo on undefined eli on kuin sitä ei olisi ollutkaan.

with-rakenne[muokkaa]

with-rakenteella voi lyhentää koodia, jos peräkkäin käytetään paljon saman olion ominaisuuksia ja metodeja.

with (olio) {
  lause;
}

Esimerkki:

var ala, tilavuus
var r=10
with (Math) {
   ala = PI * r * r;
   tilavuus = (4 /3) * PI * r * r * r;

document.write(round(ala) + "<br />");
document.write(round(tilavuus));
}

Ilman with rakennetta jokaiseen PI- ja round-kutsuun tulisi laittaa alkuun "Math.".

Funktio[muokkaa]

Funktio (function) on nimetty koodilohko, joka suoritetaan vain sitä kutsuttaessa eli se on aliohjelma.

Funktio muodostetaan seuraavasti:

function nimi(muuttuja1,muuttaja2,...,muuttujaN)
{
koodi;
}
nimi 
on funktion nimi, jolla sitä kutsutaan
muuttuja1,muuttaja2,...,muuttujaN 
ovat funktion muuttujia

Funktiota kutsutaan seuraavasti:

funktio () // muuttujaton funktio
nimi(muuttuja1,muuttaja2) // funktio, jossa on kaksi muuttujaa

Mikäli funktion halutaan palauttavan jotain tulee käyttää return-lausetta

function tulo(a,b)
{
x=a*b;
return x;
}

Em. funktion palautus saadaan seuraavasti:

kertolaskunTulos=tulo(2,3); // kertolaskunTulos-muuttaja saa arvoksi tulon

Erikoismerkit[muokkaa]

Erikoismerkkejä käytetään esimerkiksi XHTML-koodin kanssa mahdollisissa ristiriitatilanteissa.

\n 
rivinvaihto
\t 
sarkain
\' 
heittomerkki (')
\" 
lainausmerkki (")
\\ 
kenoviiva (\)

Lause[muokkaa]

Lause (statement) JSssä on käsky selaimelle suorittaa jokin toiminto. Se on muotoa:

window.alert("Hei maailma!");

missä

window.alert 
on JS-komento, tarkemmin window-olion alert-metodi
"Hei maailma!" 
on komennon arvo
; 
on lauseen päättävä merkki

Lauseke[muokkaa]

Lauseke (expression) on yhdistelmä muuttujia, operaattoreita, tietotyyppejä ja lausekkeita, mikä tuottaa yksittäisen tuloksen, kuten numeron, merkkijonon, tai totuusarvon. Lausekkeet voidaan jakaa kahteen tyyppiin:

  • operaattorilauseke tuottaa jonkin tuloksen
  • sijoitusoperaattorilauseke sijoittaa tuloksen muuttujaan
1 + 2      // operaattorilauseke tuottaa tuloksen 3
Summa=1+2 // sijoitusoperaattorilauseke sijoittaa tuloksen muuttujaan

Myös lauseke on lause.

Lohko[muokkaa]

Lohko (block) on lauseiden kokonaisuus.

{
window.alert("1.");
window.alert("2.");
window.alert("ja 3. kerta.");
}

Perusoperaattorit[muokkaa]

Aritmeettiset operaattorit[muokkaa]

Aritmeettisillä operaattoreilla suoritetaan aritmeettisiä operaatioita muuttujia ja/tai arvojen välillä. Lisäksi +-operaattorilla voidaan yhdistää merkkijonoja.

Aritmeettiset operaattorit
Operaattori Kuvaus Esimerkkki, kun x = 5
Merkintä Tulos
+ Lisäys x=y+2 x=7
- Vähennys x=y-2 x=3
* Kerto x=y*2 x=10
/ Jako x=y/2 x=2.5
% Jakojäännös x=y%2 x=1
++ Lisäys x=++y x=6
-- Vähennys x=--y x=4

Sijoistusperaattorit[muokkaa]

Sijoitusoperaattoreilla sijoitetaan muuttujiin arvoja.

Sijoitusoperaattorit
Operaattori Esimerkkki, kun x = 10 ja y = 5
Merkintä Vastaava merkintä Tulos
= x=y x=5
+= x+=y x=x+y x=15
-= x-=y x=x-y x=5
*= x*=y x=x*y x=50
/= x/=y x=x/y x=2
%= x%=y x=x%y x=0


Vertailuoperaattorit[muokkaa]

Vertailuoperaattoreilla vertaillaan muuttujien ja arvojen yhtäläisyyttä ja eroavuutta.

Vertailuoperaattorit
Operaattori Kuvaus Esimerkkki, kun x = 5
Merkintä Tulos
== on yhtäkuin x==8 epätosi
=== on täsmälleen yhtä kuin (arvo ja tyyppi samat) x===5 tosi
x==="5" epätosi
!= ei ole yhtä kuin x!=8 tosi
> on suurempi kuin x>8 epätosi
< on pienempi kuin x<8 tosi
>= on suurempi tai yhtä suuri kuin x>=8 epätosi
<= on vähemmän tai yhtä suuri kuin x<=8 tosi

Loogiset operaattorit[muokkaa]

Loogisilla operaattoreilla voidaan yhdistää vertailuja.

Loogiset operaattorit
Operaattori Kuvaus Esimerkkki, kun x=6 ja y=3
Merkintä Tulos
&& ja x < 10 && y > 1 tosi
|| tai x==5 || y==5 epätosi
! ei  !(x==y) tosi

Ehdollinen operaattori[muokkaa]

Ehdollisella operaattorilla voidaan määrittää muuttujalle arvo tietyn ehdon mukaan muodossa:

puuttuja=(ehto)?ehtotosi:ehtoepatosi;

missä

puuttuja
on määriteltävä muuttuja
ehto 
on vertailulauseke
ehtotosi
ehtoepatosi

Muuttuja[muokkaa]

Muuttuja (variable) on ohjelmoijan nimittämä tiedon tallennuspaikka. Muuttujalla on nimi ja se sisältää arvon, joka voi olla numero, merkkijono, tauluko tai olio. Muuttujan nimellä (identifiers) on seuraavat vaatimukset:

  • yhteensopivuussyistä saa sisältää vain ASCII-kirjaimia (A-Z, a-z) ja numeroita (0-9).
  • tulee alkaa kirjaimella tai alaviivalla (_).
  • ei saaolla varattu sana eli avainsana

Muuttujat kannattaa nimetä niin, että se helpottaa koodin luettavuutta ja ymmärrettävyyttä. Standardissa JavaScriptissä muuttujilla ei ole niihin kiinnitettyä tyyppiä, joten mikä tahansa arvo voidaan tallentaa mihin tahansa muuttujaan. Koska nimi ei saa sisältää välilyöntiä (lasketaan merkiksi) merkitään sanayhdistelmät yleensä siten että uusisana on versaalilla tai siten että sanojen välissä on alaviiva eli sanaYdistelma tai sana_yhdistelma.

Varatut sanat eli avainsanat[muokkaa]

JS käsittää joukon varattuja sanoja (reserved words), joita ei saa käyttää muuttujien, funktioiden, metodien eikä olioiden nimissä. Varatut sanat ovat ohjelmarakenteissa käytettyjä avainsanoja, joista jotkut on vasta varattu tulevaa käyttöä varten.

JSn varatut sanat
abstract
boolean
break
byte
case
catch
char
class
const
continue
debugger
default
delete
do
double
else
enum
export
extends
false
final
finally
float
for
function
goto
if
implements
import
in
instanceof
int
interface
long
native
new
null
package
private
protected
public
return
short
static
super
switch
synchronized
this
throw
throws
transient
true
try
typeof
var
void
volatile
while
with

Muuttujien esittely ja alustaminen[muokkaa]

JS-muuttujat esitellään (luodaan) (declare) var-avainsanalla (variable). Avainsanan käyttö ei aina ole pakollista, mutta se on aina sallittua ja suositeltavaa. Huomioitavaa on että, jos var-avainsanaa ei käytetä muuttuja on aina globaali.

//esitellään puuttuja-muuttuja:
var puuttuja;

JS sallii muuttujien alustamisen niiden esittelyn yhteydessä. Alustaminen tarkoittaa jonkun arvon sijoittamista muuttujaan:

//esitellään puuttuja-muuttuja ja alustetaan sen arvoksi nolla:
var puuttuja = 0;
//esitellään puuttuja-muuttuja ja alustetaan sen arvoksi teksti:
var puuttuja = "teksti";

Tekstiä sisältävä arvo tulee laittaa aina lainausmerkkeihin.

Vaikutusalue[muokkaa]

Muuttujien vaikutusalue riippuus siitä missä ne julistetaan. Muuttujien vaikutusalueita on kaksi:

globaali muuttuja 
funktion ulkopuolella esitelty muuttuja, jonka arvo on käytettävissä ja muunneltavissa ilman rajoituksia
lokaali muuttuja 
funktion sisäpuolella var-avainsanalla esitelty muuttuja, jonka arvo on käytettävissä ja muunneltavissa ainoastaan kyseisen funktion sisässä.
x = 0; // globaali muuttuja, ei-suositeltava tapa
var y = 'Hei!'; // toinen globaali muuttuja, suositeltava tapa
 
function f(){
  var z = 'Näkemiin!'; // lokaali muuttuja
  tusina = 12; // globaali muuttuja, koska var-avainsanaa ei käytetty
}
// z-muuttuja ei enää ole käytettävissä, mutta x, y, ja tusina ovat

Ohjainrakenteet[muokkaa]

Ehtorakenteet[muokkaa]

if ... else[muokkaa]

if toistaa koodin mikäli ehto toteutuu.

if (ehto) {
  lause1
} else {
  lause2
}

Esimerkki:

var rauha="sota";
var sotaa="sota";
if (rauha==sotaa) {
document.write("On vuosi 1984.");
} else {
document.write("OK.");
}

switch[muokkaa]

switch toistaa annetuista vaihtoehtoisista koodeista sen, jolle annettu tunnus täsmää lausekkeen kanssa. break-avainsanaa tarvitaan katkaisemaan koodin suorittaminen, sillä muuten koodin suoritus jatkuisi oikeasta arvosta loppuun saakka.

switch (lauseke) {
  case arvo1:
    lause1;
    break;
  case arvo2:
    lause2;
    break;
  ...
  default:
    oletuslause;
}

Esimerkki:

var luku=3
switch (luku) {
  case 1:
    document.write("Luku on 1 eikä 2 tai jotain muuta.");
    break;
  case 2:
    document.write("Luku on 2 eikä 1 tai jotain muuta.");
    break;
  default:
    document.write("Luku ei ole 1 eikä 2 vaan jotain muuta.");
}

Toistorakenteet[muokkaa]

break-avainsana katkaisee silmukan suorittamisen. continue-avainsana katkaisee meneillään olevan silmukan ja jatkaa seuraavasta arvosta.

for[muokkaa]

for toistaa koodia niin pitkään kuin ehto toteutuu. for-rakenteella koodia voidaan toistaa haluttu määrä kertoja.

for (alustus; ehto; jatko) {
  lause;
}

Esimerkki:

for (i = 0; i < 4; i++) {
  document.write(i);
}

while[muokkaa]

while toistaa koodia niin pitkään kuin ehto on voimassa.

while (ehto) {
  lause;
}

Esimerkki:

var i=0;
while (i<=4) {
document.write(i);
i=i+1;
}

do ... while[muokkaa]

do while toistaa ensin koodin kerran ja sitten niin pitkään kuin ehto on voimassa

do {
  lause;
}

while (ehto)

Esimerkki:

var i=0;
do {
document.write(i);
i=i+1;
}
while (i<0);

for ... in[muokkaa]

for in rakenteella voidaan käydä läpi taulukon tai olion muuttujia.

for (muuttuja in olio) {
  lause;
}

Esimerkki:

var x;
var merkit = new Array();
merkit[0] = "Asteriski";
merkit[1] = "Heittomerkki";
merkit[2] = "Lainausmerkki";

for (x in merkit)
{
document.write(merkit[x] + "<br />");
}

Ponnahduslaatikot[muokkaa]

Ponnahduslaatikko on sivua ladattaessa tai toiminnolla ruudulle tulostettava laatikko, joka pysäyttää koodin suorittamisen kunnes käyttäjä kuittaa sen.

Huomautuslaatikko[muokkaa]

Huomautuslaatikko (Alert Box) vaatii käyttäjän kuittauksen eli "OK"-painikkeen klikkauksen. Sitä käytetään huomauttamaan käyttäjää jostain asiasta.

alert("sometext");

Vahvistuslaatikko[muokkaa]

Vahvistuslaatikko (Confirm Box) vaatii käyttäjän kuittauksen, joka hyväksynnän ("OK") tai hylkäämisen ("Cancel"). Sitä käytetään, kun halutaan käyttäjältä kyllä tai ei vastaus. "OK" palauttaa arvon true ja "Cancel" arvon false.

confirm("sometext");

Kyselylaatikko[muokkaa]

Kyselylaatikko (Prompt Box) pyytää käyttäjää syöttämää merkkejä ja hyväksymään tai hylkäämään sen. Sitä käytetään kun käyttäjältä halutaan jotain tietoa. Kyselylaatikossa on painikkeet "OK" ja "Cancel". "OK" palauttaa syötetyn merkkijonon ja "Cancel" arvon null.

prompt("sometext","oletusarvo");