Mi a prototípus öröklés JavaScript-ben?

A JavaScript objektumok öröklődnek a prototípusaiktól tulajdonságokat és módszereket. Minden objektum prototípusa egy másik objektum, amelynek tulajdonságai és módszerei a prototípus láncon keresztül érhetők el.

Amikor egy objektum tulajdonságához férünk hozzá, a JavaScript először közvetlenül az objektumban keresi. Ha nem találja, akkor a prototípusában, majd a prototípus prototípusában, és így tovább, amíg a tulajdonságot meg nem találja vagy el nem éri a lánc végét (null).

A prototípus alapú öröklődés különbözik a klasszikus öröklődéstől (mint Java vagy C++), ahol az objektumokat olyan osztályokból hozzák létre, amelyek leírják szerkezetüket és viselkedésüket. A JavaScript ES6-ban megjelent osztályai szintaktikus cukorként szolgálnak a prototípus alapú öröklődés felett.

Főbb aspektusok:

• __proto__: Az objektum belső tulajdonsága, amely a prototípusára utal.
• prototype: A konstruktor (függvény, amit konstruktorként használnak) tulajdonsága, amely az objektumot, mint prototípust, a példányok számára.
• Object.getPrototypeOf(obj): Az objektum prototípusának standard módja.
• Object.setPrototypeOf(obj, proto): Az objektum prototípusának standard módja.

Példa:

// Konstruktor függvény
function Animal(name) {
  this.name = name;
}

// Módszer hozzáadása az Animal prototípusához
Animal.prototype.sayHello = function() {
  console.log(`Hello, my name is ${this.name}`);
};

// Példány létrehozása
const dog = new Animal("Buddy");

// A prototípusból hívott módszer
dog.sayHello(); // Kimenet: Hello, my name is Buddy

// A dog prototípusa az Animal.prototype
console.log(Object.getPrototypeOf(dog) === Animal.prototype); // Kimenet: true

// Az Animal.prototype prototípusa az Object.prototype
console.log(Object.getPrototypeOf(Animal.prototype) === Object.prototype); // Kimenet: true

// A protokoll lánc vége null
console.log(Object.getPrototypeOf(Object.prototype) === null); // Kimenet: true

Összehasonlítva az ES6-os osztályos örökléssel:

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

  sayHello() {
    console.log(`Hello, my name is ${this.name}`);
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name); // Szülő osztály konstruktorának hívása
    this.breed = breed;
  }

  bark() {
    console.log("Woof!");
  }
}

const buddy = new Dog("Buddy", "Golden Retriever");
buddy.sayHello(); // Kimenet: Hello, my name is Buddy (öröklődik az Animal-tól)
buddy.bark(); // Kimenet: Woof! (Dog módszere)

// Az ES6 osztályok szintaktikus cukorként működnek a prototípusok felett
console.log(Object.getPrototypeOf(Dog) === Animal); // Kimenet: true (öröklődés osztályok között)
console.log(Object.getPrototypeOf(Dog.prototype) === Animal.prototype); // Kimenet: true (módszerek öröklődése prototípusokon keresztül)
console.log(Object.getPrototypeOf(buddy) === Dog.prototype); // Kimenet: true (példány öröklődik az osztály prototípusától)

A prototípus alapú öröklődés JavaScript egyik kulcsfogalma, amelynek megértése elengedhetetlen a nyelv hatékony használatához.