JavaRush /Курси /Frontend SELF UA /Наслідування класів

Наслідування класів

Frontend SELF UA
Рівень 40 , Лекція 0
Відкрита

7.1 Основи наслідування

Наслідування класів у JavaScript дозволяє створювати нові класи на основі вже існуючих, повторно використовувати та розширювати їх функціональність. Це ключовий аспект об'єктно-орієнтованого програмування (ООП), який дозволяє створювати ієрархії класів та керувати поведінкою об'єктів.

Для наслідування класів використовується ключове слово extends. Клас, який наслідує інший клас, називається похідним класом (subclass), а клас, від якого наслідування походить, називається базовим класом (superclass).

Приклад:

JavaScript
    
      class Animal {
        constructor(name) {
          this.name = name;
        }

        speak() {
          console.log(`${this.name} видає звук.`);
        }
      }

      class Dog extends Animal {
        speak() {
          console.log(`${this.name} гавкає.`);
        }
      }

      const dog = new Dog('Рекс');
      dog.speak(); // "Рекс гавкає."
    
  

Пояснення:

  • Клас Animal є базовим класом із конструктором і методом speak()
  • Клас Dog наслідує Animal і перевизначає метод speak()
  • Екземпляр dog класу Dog використовує перевизначений метод speak()

7.2 Ключове слово super

Ключове слово super використовується для виклику конструктора або методів базового класу з похідного класу.

1. Виклик конструктора базового класу

Похідний клас повинен викликати конструктор базового класу за допомогою super() перед використанням this.

Приклад:

Конструктор Dog викликає super(name), щоб ініціалізувати властивість name базового класу Animal.

JavaScript
    
      class Animal {
        constructor(name) {
          this.name = name;
        }

        speak() {
          console.log(`${this.name} видає звук.`);
        }
      }

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

        speak() {
          console.log(`${this.name} гавкає.`);
        }
      }

      const dog = new Dog('Рекс', 'Лабрадор');
      console.log(dog.name); // "Рекс"
      console.log(dog.breed); // "Лабрадор"
      dog.speak(); // "Рекс гавкає."
    
  

2. Виклик методів базового класу

Методи базового класу можуть бути викликані з похідного класу за допомогою super.

Приклад:

Метод speak() класу Dog викликає метод speak() базового класу Animal за допомогою super.speak(), а потім виконує власну логіку.

JavaScript
    
      class Animal {
        constructor(name) {
          this.name = name;
        }

        speak() {
          console.log(`${this.name} видає звук.`);
        }
      }

      class Dog extends Animal {
        speak() {
          super.speak(); // Виклик методу базового класу
          console.log(`${this.name} гавкає.`);
        }
      }

      const dog = new Dog('Рекс');
      dog.speak();

      // "Рекс видає звук."
      // "Рекс гавкає."
    
  

7.3 Наслідування і перевизначення методів

Наслідування дозволяє похідним класам перевизначати методи базового класу. Це дає змогу змінювати або розширювати функціональність методів.

Приклад:

Метод speak() класу Dog перевизначає метод speak() базового класу Animal, надаючи власну реалізацію.

JavaScript
    
      class Animal {
        constructor(name) {
          this.name = name;
        }

        speak() {
          console.log(`${this.name} видає звук.`);
        }
      }

      class Dog extends Animal {
        speak() {
          console.log(`${this.name} гавкає.`);
        }
      }

      const animal = new Animal('Звичайна тварина');
      animal.speak(); // "Звичайна тварина видає звук."

      const dog = new Dog('Рекс');
      dog.speak(); // "Рекс гавкає."
    
  

7.4 Наслідування і додаткові методи

Похідний клас може додавати нові методи, які не існують у базовому класі.

Приклад:

Клас Dog додає новий метод fetch(), який не існує у базовому класі Animal.

JavaScript
    
      class Animal {
        constructor(name) {
          this.name = name;
        }

        speak() {
          console.log(`${this.name} видає звук.`);
        }
      }

      class Dog extends Animal {
        speak() {
          console.log(`${this.name} гавкає.`);
        }

        fetch() {
          console.log(`${this.name} приносить палицю.`);
        }
      }

      const dog = new Dog('Рекс');
      dog.speak(); // "Рекс гавкає."
      dog.fetch(); // "Рекс приносить палицю."
    
  

7.5 Перевірка наслідування

Для перевірки наслідування можна використовувати оператор instanceof і метод isPrototypeOf().

Приклад:

Оператор instanceof перевіряє, чи є об'єкт екземпляром класу. Метод isPrototypeOf() перевіряє, чи є прототип об'єкта частиною ланцюжка прототипів іншого об'єкта.

JavaScript
    
      console.log(dog instanceof Dog); // true
      console.log(dog instanceof Animal); // true
      console.log(Animal.prototype.isPrototypeOf(Dog.prototype)); // true
    
  
Коментарі
ЩОБ ПОДИВИТИСЯ ВСІ КОМЕНТАРІ АБО ЗАЛИШИТИ КОМЕНТАР,
ПЕРЕЙДІТЬ В ПОВНУ ВЕРСІЮ