Прототипно наследяване в JavaScript: Обяснено с прости термини

Ако сте разработчик на JavaScript, вероятно сте чували за прототипно наследяване. Това е основна концепция в JavaScript, която често се използва за създаване на сложни приложения. Въпреки това, разбирането на прототипното наследяване може да бъде предизвикателство за начинаещи. В тази публикация в блога ще обясним прототипното наследяване с прости думи и ще обсъдим начините, по които можете да създавате наследени класове в JavaScript.

Какво е прототипно наследяване?

Прототипното наследяване е начин за създаване на обекти в JavaScript. За разлика от класическото наследяване в обектно-ориентирани езици за програмиране като Java и C++, то не включва създаване на план за клас. Вместо това създавате обект, който служи като прототип за други обекти. С други думи, вместо да създавате план за клас, вие създавате обект, от който други обекти наследяват.

Създаване на наследени класове в JavaScript

След като вече знаете какво е прототипно наследяване, нека обсъдим начините, по които можете да създавате наследени класове в JavaScript.

Конструкторски функции

Конструкторските функции се използват за създаване на обекти със специфичен набор от свойства и методи. За да създадете функция конструктор за обект, вие използвате ключовата дума „function“, последвана от името на функцията конструктор. След това можете да използвате свойството „прототип“, за да добавите методи и свойства към прототипа на този обект. Това позволява на всички обекти, създадени от тази конструкторска функция, да наследяват тези свойства и методи.

function Animal(name) {
  this.name = name;
}

Animal.prototype.sayName = function() {
  console.log("My name is " + this.name);
}

function Dog(name, breed) {
  Animal.call(this, name);
  this.breed = breed;
}

Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

Dog.prototype.bark = function() {
  console.log("Woof! I'm a " + this.breed);
}

let myDog = new Dog("Rufus", "Labrador Retriever");

myDog.sayName(); 
// My name is Rufus
myDog.bark(); 
// Woof! I'm a Labrador Retriever

Object.create()

Методът Object.create() ви позволява да създадете нов обект и да посочите неговия прототип. Това може да бъде полезно за създаване на обекти, които наследяват от конкретен обект. За да създадете обект с помощта на Object.create(), подавате обекта, който искате да използвате като прототип, като първи аргумент.

let myPrototype = {
  sayHello: function() {
    console.log("Hello!");
  }
};

let myObject = Object.create(myPrototype);

myObject.sayHello(); 
// Hello!

Синтаксис на класа

Синтаксисът на класа, въведен в ES6, е друг начин за създаване на класове, които използват прототипно наследяване. Дефинирате клас с конструкторска функция и прототипни методи и след това използвате ключовата дума „extends“, за да създадете подклас, който наследява от родителския клас.

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

  bark() {
    console.log("Woof! I'm a " + this.breed);
  }
}

let myDog = new Dog("Rufus", "Labrador Retriever");

myDog.sayName(); 
// My name is Rufus
myDog.bark(); 
// Woof! I'm a Labrador Retriever

Фабрични функции

Фабричните функции са функции, които създават и връщат обекти. За да създадете фабрична функция, която създава обекти със специфичен набор от свойства и методи, вие дефинирате функцията и след това използвате метода „Object.assign()“, за да добавите тези свойства и методи към прототипа на обекта.

function createAnimal(name) {
  let animal = {
    name: name,
    eat: function() {
      console.log("Nom nom nom");
    }
  };

  return animal;
}

function createDog(name, breed) {
  let dog = createAnimal(name);

  dog.breed = breed;

  dog.bark = function() {
    console.log("Woof! I'm a " + this.breed);
  };

  return dog;
}

let myDog = createDog("Fido", "Labrador Retriever");

console.log(myDog.name); // Output: Fido
myDog.eat(); 
// Nom nom nom
myDog.bark(); 
// Woof! I'm a Labrador Retriever

Прототипното наследяване е мощна функция на JavaScript, която ви позволява да създавате обекти, които наследяват свойства и методи от прототип на обект. Като разберете начините, по които можете да създавате наследени класове в JavaScript, можете да използвате тази функция за създаване на сложни и мащабируеми приложения.