JavaScript

JS er det som gjør nettsidene vi lager interaktive og dynamiske. Når du klikker på en knapp og det skjer noe er det nesten alltid Javacript som kjøres og sørger for det som skjer.

Historie

Aller først, du lurer kanskje på om dette har noe med Java å gjøre? Nei, nei og atter nei. JavaScript har i dag ingenting med Java å gjøre. Men jo, det har litt med Java å gjøre helt fra begynnelsen. Nettleserselskapet Netscape Communications ansatte i 1995 Brendan Eich for å jobbe med å lage et nytt språk som kunne gjøre nettsider mer dynamiske. På den tiden var de statiske og bestod av HTML og CSS.

Netscape samarbeidet litt med selskapet Sun Microsystems som hadde utviklet og eide rettighetene til Java og de ønsket å lage et språk som kunne komplementere Java. Brendan hentet inspirasjon fra både Java, Self og Scheme da han lagde JavaScript. Men han kalte språket Mocha og ikke JavaScript. Internt i Netscape likte de bedre å kalle det LiveScript

Kort tid etter at Netscape fikk lansert sin nye nettleser Netscape Navigator 2.0 innså Microsoft at de også trengte et språk for å gjøre nettsider dynamiske i deres egen nettleser Internet Explorer. De kopierte mye fra Netscape gjennom "reverse-engineering" men kalte sitt språk for JScript

Året etter, altså i 1996 bestemte Netscape seg for å heller dele sitt språk med andre leverandører og unngå komplett kaos for utviklere og brukere. Oppgaven med standardisering ble gitt til ECMA (European Computer Manufacturers Association) som valge å kalle språket ECMAScript for å unngå problemer med bruk av et registrert varemerke.

JavaScript har hatt en varierende versjonshistorikk men nå jobber de med årlig ny versjon. Årets versjon er den 14nde versjonen.

Kode

Vi starter med det mest grunnleggende: variabler. En variabel inneholder en verdi som for eksempel tall eller tekst. Ordet var angir at dette er en variabel, vi kan også bruke let og const for å si at noe er en variabel.


    var variabelNavn = "teksten vi vil lagre";

Da er vi klare til å på litt logikk. Først har vi et eksempel som viser kode som gjør en ting hvis en betingelse er sann og noe annet dersom den er usann.


    var tall = 7;
    if(tall == 7){
        console.log("Tallet er 7");
    } else {
        console.log("Tallet er ikke 7");
    }

Kode som vi bruker flere ganger pakker vi inn som funksjoner slik at vi kan bruke dem om igjen flere ganger:


    function add(a, b) {
        return a + b;
    }
    
    add(1, 2);  // returnerer tallet 3

Funksjonen add kan gjenbrukes og kalles om igjen og med ulike verdier og er en veldig simpel og enkel kalkulator som bare legger sammen to tall og sender summen tilbake.

En annen måte å gjenbruke kode er å bruke løkker. Da kjøres koden et bestemt antall ganger slik som her:


    // her kaller vi funksjonen add 10 ganger 
    // og sender telleren fra løkken inn som en av parameterene
    for(var i = 0; i < 5; i++){
      add(1, i); 
    }

For at koden skal kunne gjøre en side mer dynamisk må den kobles sammen med sidens elementer og det kan f.eks gjøres slik:


    function add(a, b) {
        let sum = a + b;
        // endrer teksten i et element i HTML
        result.innerHTML = "Resultatet er: " + sum;
    }

    // Kobler sammen et element i HTML med en variabel i JavaScript
    const result = document.querySelector("#result");

    // Kobler sammen en funksjon med en knapp i HTML
    const button = document.querySelector("#addbutton");
    button.addEventListener("click", add(2,2));

JavaScript støtter flere ulike datatyper. I eksempelet over her la vi sammen to tall, men vi kan også sette sammen to tekster:


    function add(a, b) {
        return a + b;
    }
    
    add("Asbjørn ", "Hansen");  // returnerer teksten "Asbjørn Hansen"

Og her er noen flere eksempler på typer data vi kan jobbe med:


    var a = 5; // number
    var b = "Asbjørn"; // string
    var c = true; // boolean
    var d = null; // null
    var e = undefined; // undefined
    var f = ["Asbjørn", "Hansen"]; // array
    var g = {fornavn: "Asbjørn", etternavn: "Hansen"}; // object

Når man begynner å jobbe med mange ulike variabler og funksjoner kan det fort bli vanskelig å holde oversikten dersom man navngir variablene a, b, c, osv. Så det å gi fornuftige og beskrivende navn er viktig.

Og da passer det med et par klassiske programmersitat:

There are only two hard things in Computer Science: cache invalidation and naming things.

-- Phil Karlton

Any application that can be written in JavaScript, will eventually be written in JavaScript.

-- Jeff Atwood (developer, creator of Stack Overflow)

Fun facts

Kanskje dette var nok for å gi et lite innblikk i JavaScript?

Les mer

I neste luke tar vi en liten snartur innom AI før vi fortsetter på vår kodereise. Vi sees!