Menu
Coddy logo textTech

Dziedziczenie właściwości i metod

Część sekcji Programowanie obiektowe ścieżki JavaScript w Coddy. Lekcja 28 z 56.

Gdy klasa rozszerza inną klasę, dziedziczy wszystkie właściwości i metody klasy nadrzędnej. Oznacza to, że klasy potomne automatycznie mają dostęp do wszystkiego, co zdefiniowano w klasie nadrzędnej.

Utwórzmy klasę nadrzędną z właściwościami i metodami:

class Animal {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  
  eat() {
    return `${this.name} is eating`;
  }
  
  sleep() {
    return `${this.name} is sleeping`;
  }
}

Teraz utwórzmy klasę potomną dziedziczącą po klasie Animal:

class Dog extends Animal {
  constructor(name, age, breed) {
    super(name, age);
    this.breed = breed;
  }
}

Utwórz instancję klasy Dog:

const rex = new Dog("Rex", 3, "German Shepherd");

Teraz, mimo że nie zdefiniowaliśmy eat() i sleep() w klasie Dog, nadal możemy używać tych metod:

console.log(rex.eat());  // Wyświetla: Rex is eating
console.log(rex.sleep()); // Wyświetla: Rex is sleeping

Możemy też uzyskać dostęp do wszystkich odziedziczonych właściwości:

console.log(rex.name);  // Wyświetla: Rex
console.log(rex.age);   // Wyświetla: 3
console.log(rex.breed); // Wyświetla: German Shepherd
challenge icon

Wyzwanie

Utwórz klasę Cake, która rozszerza klasę Dessert, i wyeksportuj ją. Klasa Cake powinna mieć:

  • Wszystkie odziedziczone właściwości i metody z klasy Dessert
  • Nową właściwość flavor
  • Nową metodę addCandles(), która zwraca ciąg znaków “Added candles to ${this.name}!”

Spróbuj swoich sił

import { Dessert } from './desserts.js';
import { Cake } from './desserts.js';

// Kod testowy - nie modyfikuj
const myCake = new Cake("Birthday Cake", 300, "Chocolate");
console.log(myCake.describe());   // Powinno wyświetlić "Birthday Cake has 300 calories"
console.log(myCake.flavor);       // Powinno wyświetlić "Chocolate"
console.log(myCake.addCandles()); // Powinno wyświetlić "Added candles to Birthday Cake!"
quiz iconSprawdź się

Ta lekcja zawiera krótki quiz. Zacznij lekcję, żeby na niego odpowiedzieć i śledzić swoje postępy.

Wszystkie lekcje w sekcji Programowanie obiektowe

Poćwicz samodzielnie: Kompilator JavaScript online