Если вы разработчик JavaScript, вы, вероятно, слышали о прототипном наследовании. Это фундаментальная концепция JavaScript, которая часто используется для создания сложных приложений. Однако понимание прототипного наследования может быть сложным для начинающих. В этом сообщении блога мы объясним прототипное наследование простыми словами и обсудим способы создания унаследованных классов в JavaScript.

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

Наследование прототипов — это способ создания объектов в JavaScript. В отличие от классического наследования в объектно-ориентированных языках программирования, таких как Java и C++, оно не требует создания плана для класса. Вместо этого вы создаете объект, который служит прототипом для других объектов. Другими словами, вместо создания плана для класса вы создаете объект, от которого наследуются другие объекты.

Создание унаследованных классов в JavaScript

Теперь, когда вы знаете, что такое наследование прототипов, давайте обсудим способы создания унаследованных классов в JavaScript.

Функции конструктора

Функции-конструкторы используются для создания объектов с определенным набором свойств и методов. Чтобы создать функцию-конструктор для объекта, вы используете ключевое слово «функция», за которым следует имя функции-конструктора. Затем вы можете использовать свойство «прототип», чтобы добавить методы и свойства к прототипу этого объекта. Это позволяет любым объектам, созданным из этой функции-конструктора, наследовать эти свойства и методы.

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(), вы передаете объект, который хотите использовать в качестве прототипа, в качестве первого аргумента.

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

let myObject = Object.create(myPrototype);

myObject.sayHello(); 
// Hello!

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

Синтаксис класса, представленный в ES6, — это еще один способ создания классов, использующих прототипное наследование. Вы определяете класс с помощью функции-конструктора и методов-прототипов, а затем используете ключевое слово «расширяет» для создания подкласса, наследуемого от родительского класса.

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, вы сможете использовать эту функцию для создания сложных и масштабируемых приложений.