Webteknologi - Opgaver modul 4

Opgave 1 - Brug node.js

I denne opgave skal du lære at bruge node.js til at køre JavaScript-kode. Gør følgende:

Åben vscode. Find en tom folder til “opgave1”.
Lav en ny fil der hedder “app.js”. Det vigtige er, at den hedder “.js” til sidst. Fornavnet er sådan set valgfrit.
Skriv noget simpelt kode i filen, fx console.log("Hej, verden!");
Gem filen.
Find terminalen. Naviger ind til hvor den nye fil ligger.
Skriv kommandoen node app.js eller tilsvarende (brug det rigtige filnavn). Husk at stå det rigtige sted. Brug “tab”-knappen til at auto-complete filnavnet 🙂
Se at outputtet i terminalen matcher det forventede i forhold til din kode.
Kør samme kommando igen ved at trykke “pil op” efterfulgt af et tryk på “enter” i terminalen.

Nu kan du køre kode med node.js.

Opgave 2 - Øvelse i for loops

En af fordelene ved at køre kode i terminalen er, at man nemt kan afbryde programmet igen med “ctrl + c” hvis programmet ikke selv stopper. Det kan være nyttigt hvis man kommer til at lave “uendelige loops”.

Lav følgende loops i “app.js” (eller anden js-fil) og kør dem med node.js for at se om de gør det rigtige.

Lav et loop der printer alle tallene fra 5 til 50.
Lav et loop der printer alle lige tal fra 2 til 40.
Lav et loop der udregner summen af alle ulige tal fra 1 til 100. Herefter skal koden printe summen. De enkelte tal skal ikke printes.
Lav et loop der printer alle tal fra 80 til 40, dvs. i faldende orden.
Lav et loop der printer talrækken: 1 4 9 16 25 36 49

Opgave 3 - Øvelse i dobbelte for loops

Her er et eksempel på hvordan man kan bruge et “dobbelt for loop” til at printe en tabel af *:

// Filnavn: app.js
for (let i = 0; i < 10; i++) {
  let output = "";
  for (let j = 0; j < 10; j++) {
    output = output + "*";
  }
  console.log(output);
}

Outputtet i terminalen er:

$ node app.js
**********
**********
**********
**********
**********
**********
**********
**********
**********
**********

Læs koden og og forstå hvordan den virker. Lav nogle nye udgaver af programmet der hver printer en af følgende billeder:

**********
*********
********
*******
******
*****
****
***
**
*

*
**
***
****
*****
******
*******
********
*********

        *
       **
      ***
     ****
    *****
   ******
  *******
 ********
*********

Opgave 4 - Brugerinput

Lav en ny tom fil og kald den input.js. Kopier følgende kode og sæt det ind i filen:

let tekst = process.argv[2]; // Input til programmet
console.log(tekst); // Printer input

Det ser lidt kryptisk ud i første linje, men det henter simpelthen det input man har kørt programmet med og printer det ud igen. Prøv at køre programmet med denne kommando fra terminalen:

node input.js hejsa

Hvad får du som output? Hvad hvis du kalder programmet uden input? Hvad hvis du tilføjer flere inputs på én gang?

Opgave 5 - Tekst-funktioner

Når du har en variabel med tekst (dvs. en “string”), så er der en række indbyggede funktioner der kan give dig mere information om teksten. Se eksemplet herunder.

let tekst = "Hej med dig";
console.log(tekst.length);
console.log(tekst.substring(4, 7));
console.log(tekst.substring(8, 11));
console.log(tekst.includes("med"));
console.log(tekst.includes("banankage"));
console.log(tekst.replace("dig", "banankage"));
console.log(tekst.replaceAll("e", "ø"));

Hvad gør hvert enkel linje? Lav en fil og kør koden med node.js for at blive klogere på hvad den gør. Drøft resultatet med din studiegruppe. Skriv en kort sætning ned til hver linje hvor du beskriver, hvad den gør.

Opgave 6 - if-sætninger

Med udgangspunkt i dagens præsentation, skriv noget kode der bygger på en “if-sætning”. Koden skal laves sådan her:

Lav en variabel der hedder alder og som indeholder en alder (fx 5).
Lav betingelser så du får tre tilfælde:

Alder under 3
Alder fra 3 til under 6
Alder fra 6 til under 16

I hvert af de tre tilfælde udskrives en af teksterne svarende til alderen:

“Vuggestue”
“Børnehave”
“Skole”

Hvis alder falder uden for de tre betingelser, udskrives

“Voksen”

Opgave 7 - Input, tekst-funktioner og “if”

I denne opgave skal du skriv et program der læser et stykke tekst som er givet ved input. Programmet skal herefter gøre følgende:

Hvis teksten indeholder “banankage”, skal output være “Det er lækkert”.
Hvis teksten er mere end 50 tegn, skal output være “Det var en lang tekst”.
Hvis teksten er mindre end 10 tegn, skal output være "Det var en kort tekst.
Og hvis ingen af kriterierne er opfyldt, skal output være “ok”.

Hvis du gerne vil bruge mellemrum i dit input til programmet, kan du bruge citationstegn. Eksempel:

node app.js "Her er en inputtekst med nogle mellemrum i"

Opgave 8 - Små programmer med input og output

Lav følgende programmer:

Et program der blot printer længden af inputtet som et tal.
Et program der printer inputtet, men hvor alle forekomster af “kage” er erstattet med “rugbrød”.
Et program der printer hele output. Hvis output er mere end 50 tegn, printes kun de første 10 tegn.
Et program der enten printer “forbudt” eller “godkendt”. Hvis inputteksten indeholder et ord fra følgende liste, skrives “forbudt”, eller skrives “godkendt”. Listen: “svin”, “hundehovede”, “skidespræller”, “skiderik”, “socialdemokrat”.

Opgave 9 - Programmer med to input

Du skal også lige prøve at lave et par programmer med to tal-input. Brug følgende skabelon:

// parseInt har til formål at lave en tekst om til et heltal
let tal1 = parseInt(process.argv[2]); // Input tal 1
let tal2 = parseInt(process.argv[3]); // Input tal 2
console.log(tal1, tal2); // Udskriver begge input-tal

Lav følgende programmer:

Et program der printer enten “tal1 er størst” eller “tal2 er størst”.
Et program der udskriver summen af de to input-tal.
Et program der via et loop udskriver alle tal fra tal1 til tal2.
Et program der udskriver 5 tal, startende med tal1, men hvor intervallet imellem tallene er lig med tal2. Fx giver node app.js 0 5 outputtet 0 5 10 15 20.

Opgave 10 - Et terningespil

Færdiggør dette lille terningespil. Start med at køre koden ved at sætte det ind i en ny js-fil og kør den med node. Det forventes ikke at du forstår hver linje kode på nuværende tidspunkt. Accepter blot at der er nogle ting som vi først kan forstå senere 🙂

Nu skal du færdiggøre den del af koden hvor der står TODO.

// Noget JavaScript der gør det muligt at læse fra terminalen når der skrives.
const readline = require('readline').createInterface({
  input: process.stdin,
  output: process.stdout
})

// Noget JavaScript der læser et svar på et spørgsmål fra terminalen.
readline.question(`Hvad bliver næste terningekast? `, function(gæt) {
  console.log(`Du gætter på ${gæt}!`);

  // Kast terning: 
  let terning = Math.floor(Math.random() * 6 + 1);
  console.log(`Der blev kastet ${terning}!`);

  // TODO: Udskriv om spilleren gættede rigtigt eller forkert!

  readline.close();
})

Ekstraopgave 1 (svær)

Prøv at lave et terningespil, hvor to får lov til at gætte, og den der kommer tættest på, har vundet! Og hvis de er lige tætte, er det uafgjort.

Variant: Lav om på terningen, så den har mere end seks sider.