Przejdź do głównej zawartości

Bug #016

🪲 Znajdź buga​

const myDog = new Dog()
const myCat = new Cat()

function Dog() {
  this.name = "Pluto"
}

class Cat {
  constructor() {
    this.name = "Garfield"
  }
}

console.log(myDog.name)
console.log(myCat.name)

Czy przedstawiony kod zadziała poprawnie? Jeśli nie, to gdzie kryje się błąd?

🧪 Rozwiązanie​

const myDog = new Dog()

function Dog() {
  this.name = "Pluto"
}

class Cat {
  constructor() {
    this.name = "Garfield"
  }
}

const myCat = new Cat()

console.log(myDog.name)
console.log(myCat.name)

Uruchomienie kodu z błędem wyrzuci nam do konsoli błąd Cannot access 'Cat' before initialization.

W JavaScript deklaracje funkcji oraz zmiennych definiowanych wyrażeniem var są podciągane na początek wykonywanego kodu. Własność tą z j. angielskiego nazywamy hoisting.

Hoisting w JS oznacza, że możemy najpierw wywołać funkcję, a dopiero w dalszej części kodu ją zdefiniować.

Nie możemy jednak zrobić tego samego z klasą. Deklaracja class nie jest podciągana, przez co nie możemy jej wywołać przed jej zdeklarowaniem.

I dokładnie to jest powodem wystąpienia błędu w wcześniej przedstawionym błędnym kodzie.

Aby naprawić błąd, musimy po prostu przenieść wywołanie new Cat() do dalszej części kodu, aby wywołanie nastąpiło już po deklaracji klasy.

🎢 Plac zabaw​

Otwórz edytor w nowym oknie

📑 Linki​

❤️ Podobają Ci się bugi JS?​

Podziel się linkiem ze znajomymi:
https://codisity.pl/100-bugow-js