Del 6: Funksjoner

En funksjon er en kodeblokk som gjør en spesifikk oppgave og kan brukes flere steder i koden.

Funksjoner hjelper deg å skrive ryddig, gjenbrukbar og forståelig kode. Du slipper å gjenta deg selv, og endringer kan gjøres ett sted i stedet for mange.

I stedet for å gjenta den samme koden mange steder, kan vi samle logikken i en funksjon. For eksempel kan en nettbutikk ha en funksjon som beregner frakt, legger til moms eller oppdaterer handlekurven – og da kan den samme funksjonen brukes for alle kunder, overalt i systemet. Dette gjør koden ryddigere og enklere å vedlikeholde.

Hvordan lage en funksjon

Her er en enkel funksjon som skriver en melding:

function siHei() {
  console.log("Hei, Jens!");
}

Vi har nå bare laget funksjonen. For å kjøre den må vi kalle på funksjonen i programmet:

Loading editor...

function siHei() {
  console.log("Hei, Jens!");
}

siHei()

Funksjonens parametere og argumenter

Hva om vi vil hilse på flere personer, som Julia eller Anders? I stedet for å lage en ny funksjon for hver person, kan vi bruke parametere og argumenter.

Parametere fungerer som placeholders for verdier som sendes til funksjonen. Argumenter er de faktiske verdiene vi sender når vi kaller funksjonen. Her er en oppdatert siHei()-funksjon:

Loading editor...

function siHei(navn) {
  console.log("Hei, " + navn + "!")
}

siHei("Julia")
siHei("Anders")

Her er navn parameteren, mens stringene "Julia" og "Anders" er argumentene. Nå kan vi gjenbruke funksjonen med ulike navn.

Returne verdier med funksjoner

Funksjoner kan sende verdier tilbake med return, slik at resultatet kan brukes videre.

For eksempel returnerer denne funksjonen summen av to tall:

Loading editor...

function sum(a,b) {
  return a + b;
}  
let resultat = sum(3,2);
console.log(resultat);

Funksjonen stopper når den når return, og sender verdien tilbake.

Loading editor...

function sjekkAlder(alder) {
  if (alder > 18) {
      return "Du kan få førerkort!";
  }
  return "Du kan ikke få førerkort ennå!";
}  

console.log(sjekkAlder(20))
console.log(sjekkAlder(15))

Første gang vi kaller på sjekkAlder()-funksjonen er alderen større enn 18, så funksjonen returnerer "Du kan få førerkort". Den andre gangen returneres "Du kan ikke få førerkort".

Variabler som lages inne i en funksjon finnes bare der – dette kalles local scope. Variabler utenfor funksjoner er i global scope og kan brukes overalt.

En enklere måte å gå gjennom en array: forEach

forEach er en metode på arrays som lar deg gjøre noe med hvert element uten å bruke en teller (i).

Loading editor...

let navn = ["Mia", "Ola", "Ahmed"];

navn.forEach(function(person) {
  console.log("Hei, " + person + "!");
});

navn.forEach(...) går gjennom hvert element i arrayet
Funksjonen inni forEach kjøres én gang per element
person får verdien til det nåværende elementet

Loading editor...

navn.forEach(person => console.log(`Hei, ${person}!`));

Resultatet er det samme – en personlig hilsen til hver person. Arrow-funksjonen gjør koden kortere og mer moderne.

Oppgaver – Funksjoner

Oppgave 1: Kom i gang med funksjoner

Lag en funksjon som heter printMelding. Funksjonen skal skrive ut teksten 'Hello World!' til konsollen. Endre funksjonen til å ta inn et navn som parameter, slik at meldingen blir for eksempel 'Hello (navn)'.

Oppgave 2: Returnere verdier

Skriv en funksjon multiply som tar to tall som parametere og returnerer produktet av dem. Lagre resultatet i en variabel og skriv det ut.

Oppgave 3: Celsius og Fahrenheit

Lag et program som konverterer temperatur mellom Celsius og Fahrenheit. Programmet skal: 1. Be brukeren skrive inn en temperatur med prompt(). 2. Be brukeren skrive om tallet er i 'C' eller 'F'. 3. Konverter temperaturen til den andre skalaen og skriv resultatet til konsollen. Formler: - Fahrenheit = (Celsius * 1.8) + 32, Celsius = (Fahrenheit − 32) * 0.56

Oppgave 4: Bruk forEach til å hilse på alle

Lag en liste med navn, og bruk forEach til å skrive ut en hilsen til hvert navn. Hilsningen skal være: "Hei, [navn]!". Ekstra utfordring: Utvid programmet slik at det sjekker om et navn inneholder mer enn 4 bokstaver. Hvis ja, skriv ut '(navn), du har et langt navn!' i tillegg til den vanlige meldingen.

let personer = ["Anna", "Jonas", "Ali", "Emma", "Amir"];

// Skriv forEach her

Oppgave 5: Beregn fraktkostnad med funksjon

Lag en funksjon beregnFrakt som tar inn totalPris som parameter, og returnerer fraktkostnaden basert på totalprisen: - Hvis totalpris er 200 eller mindre, er frakten 100 kr. - Hvis totalpris er mellom 201 og 1000, er frakten 50 kr. - Hvis totalpris er over 1000, er frakten gratis. Be brukeren skrive inn totalpris med prompt(), kall funksjonen, og skriv ut resultatet til konsollen.

// Skriv funksjon her
let totalPris = Number(prompt('Skriv inn totalpris:'));

// kall funksjonen her

Oppgave 6: Arrow Functions (avansert)

Gjør oppgavene ovenfor, men bruk arrow-functions istedet.

← Forrige del Neste del →