Javascript

Det er viktig å merke seg at når vi bruker JavaScript på klienten så kjører vi i det som ofte kalles en "sandbox", altså en lukket omgivelse. Vi kan ikke lese eller manipulere data på selve klienten, vi kan bare nå det som er koplet til selve nettleseren og det dokumentet den viser. Det er to unntak fra dette:

• Vi kan sette cookies på klientmaskinen slik at nettleseren husker fra en kjøring til den neste. Denne mekanismen kan også handteres med localStorage eller sessionstorage i HTML5.
• Vi kan browse filsystemet på klienten når via input-elementer med type="file". Her er det brukeren som har kontroll og som browser. Vi kan ikke fra Javascript plukke opp annet enn det valget brukeren treffer.

Generelt kan vi notere oss at JavaScript har en syntaks som ligner ganske mye på Java. Vi har variable, men ikke typer. Vi har arrayer og de viktigste kontrollstrukturene som if-else, repeat, for, while. Vi kan drive unntaksprogrammering, try-catch-finally.

I de følgende modulene vil vi ta opp de vanligste anvendelsene av JavaScript på vevsider.

Det finnes et svært stort antall vevsider på nettet med løsningsforslag i form av JavaScript-kode for de forunderligste problemer og finurligheter. Mange av kodeeksemplene du finner er skrevet for gamle nettlesere og er unødig kompliserte. Vær litt kritisk til en del av denne koden. Ofte kan den både forenkles og gjøres mer robust.

Plassering av JavaScriptet

Vi kan i prinsipp plassere javaScript-kode hvor vi vil på en HTML-side. Koden skal pakkes inn i script-elementer.

<script type="text/javascript">
  function myfunction()
  {
    ...
  }
</script>

Normalt samler vi koden i head-elementet på en HTML-side. Fordelen er da at scriptet er på plass når resten av siden lastes og eventuelt forsøker å bruke det.

Det finnes imidlertid en del situasjoner der det er lettere å tenke omvendt, nemlig at hele eller deler av siden er lastet før vi introduserer javascript-komponenter.

Det er ofte en god ide å legge skriptet på en fil for seg og la nettleseren hente det når siden lastes:

<script type="text/javascript" src="mycode.js"></script>

Det er to grunner til dette. Den ene grunnen er den åpenbare at vi kan vedlikeholde skriptet ett sted selv om det brukes på mange sider. Den andre grunnen er at vi sparer litt tid ved at skriptfila caches og altså ikke trenger å lastes hver gang sider lastes.

Dersom vi inkluderer skriptet på selve siden er anbefalt å maskere javaskriptkoden slik at den ikke parses som en del at det HTML-dokumentet er plassert på. Dette kan vi gjøre slik:

<script type="text/javascript">
//<![CDATA[
function f()
{
  T='';
  for(ix=1; ix < 4; ix++)
    T+=ix;
  alert(T+' : kjør');
}
//]]>
</script>

På denne måten unngår vi at tegn som < og > i skriptet blir tolket som en del av dokumentstrukturen.

Testing og debugging

Noen enkle mekanismer for å debugge:

• Alle nettlesere som er aktuelle har mulighet for å sette opp et eget vindu som rapporterer feil i JavaScript som kjøres på siden. Jeg pleier å bruke Tools - Error Console i FireFox. Du finner tilsvarende under Tools - Advanced på nye Operaversjoner, og du finner Tools - Developer Tools i nye Internet Explorer versjoner. Chrome har tilsvarende.

• Det er en grei strategi å bruke alert() funksjonen for å rapportere status på variable under kjøring.

  s=myVar.toString();
  alert(s);
  

• Ellers er det mulig å skrive verdier direkte til vevsiden. Det kan være nyttig i en testfase.

  document.write('<p>Nå er vi her</p>');
  

• Eller vi kan dumpe verdier i en node på en vevside mens vi tester. F.eks. slik:

  function dumpArray(A)
  {
    res='';
    for (ix=0;ix<A.length;ix++)
      res+=A[ix]+'<br/>';
    document.getElementById('dump').innerHTML=res;
  }
  

Mer om systematisk testing av Javascript i modulen: JStesting