JavaScript Academy · Lekcja

Składnia klas (zapowiedź): constructor, metody, static, extends

Łagodne wprowadzenie do składni klas: constructor, metody instancji, pomocnicze metody static oraz proste dziedziczenie z extends

Lekcja 2 z 28 kroki

Składnia klas (zapowiedź): constructor, metody, static, extends to bezpłatna lekcja JavaScript Academy na CoddyKit. To lekcja 2 z 2. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej JavaScript Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs JavaScript Academy zawiera 2 lekcji w sumie.

Wprowadzenie do składni klas

Cel: Zobaczyć, jak składnia klas odwzorowuje prototypy.

  • constructor do konfiguracji
  • methods w prototypie
  • Pomocnicze metody static w klasie
  • extends do prostego dziedziczenia
Składnia klas (zapowiedź): constructor, metody, static, extends — ilustracja 1

Constructor i metoda

constructor jest uruchamiany przy użyciu new. Metody zapisane w ciele klasy są współdzielone przez wszystkie instancje (prototyp).

// Class with a constructor and an instance method
class Counter {
  constructor(start = 0) {
    // Initialize fields
    this.value = start;
  }

  // Instance method (lives on the prototype)
  inc() {
    this.value = this.value + 1;
    console.log("Now:", this.value);
  }
}

const c = new Counter(1);
c.inc();
c.inc();
Składnia klas (zapowiedź): constructor, metody, static, extends — ilustracja 2

Współdzielenie prototypu

Metody instancji zapisane w składni klas są metodami prototypu, dlatego ponownie używana jest ta sama funkcja.

// Prototype sharing demo
class Greeter {
  say(name) {
    console.log("Hello,", name);
  }
}

const g1 = new Greeter();
const g2 = new Greeter();

// Same function reference for both instances
console.log("Same method?", g1.say === g2.say);
Składnia klas (zapowiedź): constructor, metody, static, extends — ilustracja 3

Podstawy metod statycznych

Metody static są wywoływane na samej klasie, a nie na jej instancjach.

// Static method: lives on the class, not instances
class MathBox {
  static double(n) {
    return n * 2;
  }
}

console.log("Static call:", MathBox.double(4));

const m = new MathBox();
// @ts-ignore (conceptually): next line would be undefined in JS
console.log("Instance has static?", typeof m.double);
Składnia klas (zapowiedź): constructor, metody, static, extends — ilustracja 4

Proste dziedziczenie

extends konfiguruje łańcuch prototypów; za pomocą super można wywołać metodę klasy nadrzędnej.

// Inheritance with extends and super
class Animal {
  speak() {
    console.log("...");
  }
}

class Dog extends Animal {
  speak() {
    // Optionally call parent method
    super.speak();
    console.log("Woof");
  }
}

const d = new Dog();
d.speak();
Składnia klas (zapowiedź): constructor, metody, static, extends — ilustracja 5

Wskazówki dotyczące klas

Wskazówki:

  • Klasy powinny być niewielkie: wystarczy kilka pól i metod.
  • Warto umieszczać metody instancji w ciele klasy, gdzie są współdzielone za pośrednictwem prototypu.
  • Należy używać static dla czystych funkcji pomocniczych, które nie są powiązane z instancją.
Składnia klas (zapowiedź): constructor, metody, static, extends — ilustracja 6

Quiz: umiejscowienie metody klasy

Szybkie sprawdzenie: Umiejscowienie współdzielonej metody.

Składnia klas (zapowiedź): constructor, metody, static, extends — ilustracja 7

Podsumowanie

Podsumowanie: Utworzono klasę z konstruktorem, napisano współdzielone metody instancji, dodano pomocniczą metodę statyczną oraz rozszerzono klasę bazową za pomocą super.

Składnia klas (zapowiedź): constructor, metody, static, extends — ilustracja 8
Bezpłatny start

Ucz się JavaScript dzięki korepetycjom AI — za darmo

Pisz i uruchamiaj kod w przeglądarce, otrzymuj natychmiastową pomoc od korepetytora AI dostępnego 24/7 i kontynuuj naukę w sieci lub w aplikacji.

Kursy
59
Lekcje
200

Często zadawane pytania

Czy lekcja „Składnia klas (zapowiedź): constructor, metody, static, extends” jest bezpłatna?

Tak — pełny tekst „Składnia klas (zapowiedź): constructor, metody, static, extends” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu JavaScript Academy, przejdź na CoddyKit PRO. Kurs JavaScript Academy zawiera 2 lekcji w sumie.

Co nauczysz się w „Składnia klas (zapowiedź): constructor, metody, static, extends”?

Łagodne wprowadzenie do składni klas: constructor, metody instancji, pomocnicze metody static oraz proste dziedziczenie z extends Ćwiczysz JavaScript Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć JavaScript Academy?

Nie wymagamy żadnego doświadczenia. JavaScript Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 2 z 2.

Ile czasu zajmuje lekcja „Składnia klas (zapowiedź): constructor, metody, static, extends”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji JavaScript Academy?

Tak. Każda lekcja JavaScript Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. Łańcuch prototypów i podstawy własnych właściwości
  2. Składnia klas (zapowiedź): constructor, metody, static, extends
← Powrót do JavaScript Academy