Sobes.tech
Junior

Explica cum funcționează moștenirea în JavaScript.

sobes.tech AI

Răspuns de la AI

Moștenirea în JavaScript se bazează pe prototipuri. Fiecare obiect are o proprietate internă [[Prototype]] (accesibilă prin __proto__ sau Object.getPrototypeOf()), care indică către alt obiect.

Atunci când încerci să accesezi o proprietate sau metodă a unui obiect, dacă aceasta nu este găsită direct în obiect, JavaScript o caută în [[Prototype]] al acestuia, apoi în [[Prototype]]-ul prototipului și tot așa pe lanțul de prototipuri, până când ajunge la final (Object.prototype), al cărui [[Prototype]] este null.

Aceasta este moștenirea bazată pe prototipuri.

Clasele în ECMAScript 2015 (ES6) sunt un zahăr sintactic peste moștenirea prototipică. Ele oferă o sintaxă mai familiară pentru lucrul cu prototipurile și crearea ierarhiilor de obiecte.

Exemplu de utilizare a moștenirii prototipice înainte de ES6:

// Constructorul părintelui
function Animal(name) {
  this.name = name;
}

// Metoda părintelui pe prototip
Animal.prototype.sayHi = function() {
  console.log(`Salut, sunt ${this.name}`);
};

// Constructorul copilului
function Dog(name, breed) {
  // Apelarea constructorului părintelui
  Animal.call(this, name);
  this.breed = breed;
}

// Setarea prototipului copilului la prototipul părintelui
// Păstrând referința la constructorul Dog
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

// Adăugarea metodei copilului
Dog.prototype.bark = function() {
  console.log("Ham-ham!");
};

// Crearea unei instanțe a copilului
const myDog = new Dog("Boby", "Labrador");

// Utilizarea metodelor părintelui și copilului
myDog.sayHi(); // Va afișa: Salut, sunt Boby
myDog.bark();  // Va afișa: Ham-ham!

Exemplu de utilizare a claselor (ES6):

// Clasa părinte
class Animal {
  constructor(name) {
    this.name = name;
  }

  sayHi() {
    console.log(`Salut, sunt ${this.name}`);
  }
}

// Clasa copil care moștenește de la Animal
class Dog extends Animal {
  constructor(name, breed) {
    // Apelarea constructorului părintelui
    super(name);
    this.breed = breed;
  }

  bark() {
    console.log("Ham-ham!");
  }
}

// Crearea unei instanțe a clasei copil
const myDog = new Dog("Rex", "Ciobănesc german");

// Utilizarea metodelor părintelui și copilului
myDog.sayHi(); // Va afișa: Salut, sunt Rex
myDog.bark();  // Va afișa: Ham-ham!

Puncte cheie ale moștenirii în JavaScript:

  • Prototipuri: Fiecare obiect are un prototip.
  • Lanț de prototipuri: Căutarea proprietăților sau metodelor parcurge lanțul în sus.
  • [[Prototype]]: Proprietate internă care indică către prototip.
  • __proto__: Mod învechit, dar frecvent utilizat pentru accesul la [[Prototype]].
  • Object.getPrototypeOf(): Mod recomandat pentru accesul la [[Prototype]].
  • Constructori și prototype: Folosite înainte de ES6 pentru crearea obiectelor și stabilirea prototipurilor.
  • Clase (ES6): Zahăr sintactic pentru moștenirea prototipică folosind cuvintele cheie class, extends, super.