Utmaningar

Nedan finns ett antal program, försök läsa koden och se vad som kommer att skrivas ut.

Varje fråga har ett antal alternativ att välja bland för att göra det lite lättare att resonera. Klicka på “Visa lösning” för att se svaret och förklaringen.

Om du inte lyckas så kan du alltid prova koden och köra den på egen hand för att se vad som händer, eller ta upp frågan på en handledning.

F06-01: Vilket av påståendena nedan är mest korrekt?

import { Alfa } from './Alfa.js'

const alfa = new Alfa()

Vi tilldelar konstanten alfa ett nytt objekt från “Factoryn” Alfa.
Vi instansierar ett nytt objekt utifrån klassen Alfa och sparar dess referens i konstanten alfa.
Vi skapar en ny klass Alfa och sparar dess värde i konstanten “alfa”.
Vi importerar objektet Alfa och instansierar en ny klass utifrån denna. Referensen sparas i konstanten alfa.

Tips

Lösningsförslag

Alternativ 2 är korrekt: Vi instansierar ett nytt objekt utifrån klassen Alfa och sparar dess referens i konstanten alfa. new Alfa() skapar ett nytt objekt baserat på klassdefinitionen och anropar dess konstruktor.

F06-02: Vad skrivs ut?

class Alfa {
  constructor(beta) {
    this.b = beta
  }

  get beta() {
    return this.b ** 2
  }
}

const alfa = new Alfa(4)

console.log(alfa.beta())

undefined
16
TypeError: alfa.beta is not a function
4

Tips

Lösningsförslag

Svaret är alternativ 3, TypeError: alfa.beta is not a function. get beta () deklarerar en getter — en egenskap som beräknas vid läsning. Getters anropas utan parenteser: alfa.beta, inte alfa.beta().

class Alfa {
  constructor(beta) {
    this.b = beta
  }

  get beta() {
    return this.b ** 2
  }
}

const alfa = new Alfa(4)
console.log(alfa.beta)

F06-03: Vad skrivs ut?

class Cat {
  constructor(name, age) {
    this.name = name
    this.age = age
  }
}

const cats = []
cats.push(new Cat('Dexter', 13))
cats.push(new Cat('Gustav', 16))
cats.push(new Cat('Lucifer', 6))
cats.push(new Cat('Jennie', 16))

console.log(cats[2].name)

Lucifer
Type Error: cat is not an array
13
16

Tips

Lösningsförslag

Svaret är alternativ 1, Lucifer. Arrayen cats innehåller fyra Cat-objekt. Index 2 (det tredje elementet) är new Cat('Lucifer', 6), och egenskapen name på det objektet är 'Lucifer'.

F06-04: Vad skrivs ut?

class Alfa {
  constructor(value = 0) {
    this.value = value
  }

  increment(value = 1) {
    this.value += value
  }
}

let a = new Alfa(42)

a.increment(5)
a.increment(-7)
a.increment()

console.log(a.value)

NaN
49
Koden exekverar inte färdigt utan kraschar.
41

Tips

Lösningsförslag

Svaret är alternativ 4, 41. Startvärdet är 42. increment(5) ger 47, increment(-7) ger 40, och increment() använder standardvärdet 1 och ger 41.

F06-05: Vad skrivs ut?

class Cat {
  constructor(name, age) {
    this.name = name
    this.age = age
  }

  tostring() {
    return `${this.name} is ${this.age} years old.`
  }
}

const myCat = new Cat('Dexter', 13)

console.log(myCat.toString())

undefined is NaN years old.
Dexter is 13 years old.
[object Object]
Runtime error.

Tips

Lösningsförslag

Svaret är alternativ 3, [object Object]. Klassen Cat definierar tostring() (med litet s) men anropet är toString() (med stort S). Eftersom Cat inte har toString följer JavaScript prototypkedjan upp till Object.prototype.toString(), som returnerar [object Object].

Testa att byta ut tostring mot toString i metoddeklarationen för att se skillnaden.

F06-06: Vad skrivs ut?

class MyBank {
  constructor(deposits) {
    this.deposits = Array.from(deposits)
  }

  toString() {
    return this.deposits.join(', ')
  }

  valueOf() {
    return this.deposits.reduce((sum, deposit) => sum + deposit, 0)
  }
}

const myBank = new MyBank([2500, -500, 3000])
const myOtherBank = new MyBank([5042])

console.log(myBank + myOtherBank)

2500, -500, 30005042
Runtime Error
10042
[object Object][object Object]

Tips

Lösningsförslag

Svaret är alternativ 3, 10042. +-operatorn anropar valueOf() på varje operand. myBank.valueOf() returnerar 2500 + (-500) + 3000 = 5000 och myOtherBank.valueOf() returnerar 5042. Summan är 10042.