Sobes.tech
Junior

Paaiškinkite, kaip veikia paveldėjimas JavaScript'e.

sobes.tech AI

Atsakymas iš AI

JavaScript paveldėjimas grindžiamas prototipais. Kiekvienas objektas turi vidinę savybę [[Prototype]] (pasiekiamą per __proto__ arba Object.getPrototypeOf()), kuri nurodo į kitą objektą.

Bandant pasiekti objekto savybę ar metodą, jei jis nėra tiesiogiai objekte, JavaScript ieško jo [[Prototype]] šio objekto, tada [[Prototype]] prototipo ir taip toliau prototipų grandinėje, kol pasiekia pabaigą (Object.prototype), kurio [[Prototype]] yra null.

Tai yra prototipinis paveldėjimas.

ECMAScript 2015 (ES6) klasės yra sintaksinis cukrus virš prototipinio paveldėjimo. Jos suteikia patogesnį sintaksį darbui su prototipais ir objektų hierarchijų kūrimui.

Pavyzdys, kaip naudoti prototipinį paveldėjimą iki ES6:

// Tėvo konstruktorius
function Animal(name) {
  this.name = name;
}

// Tėvo metodas prototipe
Animal.prototype.sayHi = function() {
  console.log(`Sveiki, aš ${this.name}`);
};

// Vaiko konstruktorius
function Dog(name, breed) {
  // Kviečiame tėvo konstruktorių
  Animal.call(this, name);
  this.breed = breed;
}

// Nustatome vaiko prototipą kaip tėvo prototipo kopiją
// Išsaugome nuorodą į Dog konstruktorių
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

// Pridedame metodą vaikui
Dog.prototype.bark = function() {
  console.log("Au-au!");
};

// Sukuriame vaiko egzempliorių
const myDog = new Dog("Bobi", "Labradoras");

// Naudojame tėvo ir vaiko metodus
myDog.sayHi(); // Išveda: Sveiki, aš Bobi
myDog.bark();  // Išveda: Au-au!

Pavyzdys, kaip naudoti klases (ES6):

// Tėvo klasė
class Animal {
  constructor(name) {
    this.name = name;
  }

  sayHi() {
    console.log(`Sveiki, aš ${this.name}`);
  }
}

// Vaiko klasė, paveldinti iš Animal
class Dog extends Animal {
  constructor(name, breed) {
    super(name); // Kviečiame tėvo konstruktorių
    this.breed = breed;
  }

  bark() {
    console.log("Au-au!");
  }
}

// Sukuriame vaiko klasės egzempliorių
const myDog = new Dog("Reksas", "Vokiečių aviganis");

// Naudojame tėvo ir vaiko metodus
myDog.sayHi(); // Išveda: Sveiki, aš Reksas
myDog.bark();  // Išveda: Au-au!

Pagrindiniai JavaScript paveldėjimo punktai:

  • Prototipai: Kiekvienas objektas turi prototipą.
  • Prototipų grandinė: Ieškant savybės ar metodo, ji ieškoma aukštyn prototipų grandinėje.
  • [[Prototype]]: Vidinė savybė, nurodanti prototipą.
  • __proto__: pasenęs, bet dažnai naudojamas būdas pasiekti [[Prototype]].
  • Object.getPrototypeOf(): rekomenduojamas būdas pasiekti [[Prototype]].
  • Konstruktoriai ir prototype: Iki ES6 naudoti objektų kūrimui ir jų prototipų nustatymui.
  • Klasės (ES6): sintaksinis cukrus prototipiniam paveldėjimui, naudojant class, extends, super žodžius.