ES6: Наследование

Концепция наследования — одна из трех важных концепций объектно-ориентированного программирования. Два других — это полиморфизм и интерфейс. Я постараюсь объяснить их один за другим. В объектно-ориентированном программировании наследование наследуется от одного класса (суперкласса) к другому классу.

Так как же это облегчает нашу работу? Допустим, у вас есть класс с именем «человек», и вы определили здесь различные свойства и методы. Затем вы определяете еще один класс с именем «Разработчик». И вы знаете, что в методе «Разработчик» будут те же функции, что и в «человеческом» классе. Здесь, если вы хотите снова определить те же свойства и методы в классе «Разработчик», это может оказаться для вас пустой тратой времени. Здесь в игру вступает наследование.

И она говорит нам, эй, братан, тебе не нужно этого делать, потому что я устанавливаю связь между этими двумя, и тебе не нужно переписывать свои функции. Хорошо, конечно, мы говорим, что это принесет мне большую пользу, и мы принимаем эту просьбу.

Чтобы создать наследование класса, используйте ключевое слово extends.

Класс, созданный с наследованием класса, наследует все методы другого класса.

class Car {
  constructor(brand) {
    this.carname = brand;
  }
  present() {
    return 'I have a ' + this.carname;
  }
}

class Model extends Car {                      <<== line 10
  constructor(brand, mod) {
    super(brand);
    this.model = mod;
  }
  show() {
    return this.present() + ', it is a ' + this.model;
  }
}

let myCar = new Model("Audi", "A3");
document.getElementById("demo").innerHTML = myCar.show(); 
=>> I have a Audi, it is a A3

Теперь давайте кратко объясним этот пример. Во-первых, мы создали наш класс «Автомобиль» и здесь мы сообщаем, какая у нас марка автомобиля. I have a Ford/Audi тогда я говорю ок но я хочу показать модель своей машины поэтому я пишу еще один класс. (Конечно, мы можем написать эти два в одном классе, но мы создаем два класса в качестве примера). И для этого мы создали класс «Модель». Но так как мы уже сообщали марку моей машины в нашем предыдущем классе «Автомобиль», мы говорим, что здесь ее еще раз писать не нужно, и избавляемся от события перезаписи, участвуя с «extends and super».

Между тем, тему, которую нельзя упускать, заключается в том, что мы должны повторно ввести в «конструктор» купленную выше марку. конструктор(бренд, мод) (строка 10)

Приведем еще один пример, чтобы лучше понять предмет.

class Human {  
 walk() {    
return 'I can walk';  
  }
}
class KindPerson extends Person {  
  eat() {    
   return 'I can eat';  
  }
}
const developer = new Person();
console.log(developer.walk); // walk exists
console.log(me.eat); // eat does not exists
const reactDeveloper = new KindPerson();
console.log(reactDeveloper.walk); // walk exists because of extends
console.log(reactDeveloper.eat); // eat exists

Вы также можете вызывать методы класса, который вы унаследовали, с помощью «super».

show() {
    return super.present() + ', it is a ' + this.model;
  }
}

Ну, кроме этого, то, что нам нужно знать о «Наследовании», поможет нам и облегчит понимание Наследования. Мы приведем этот пример, используя;

а) «Объект.setPrototypeOf»

const human = {}
human.__proto__.walk = function (){
  return 'I can walk';
}
const person = {};
Object.setPrototypeOf(person, human);
person.walk(); // I can walk

б) Объект.создать

const human = {  
  walk() {    
    return 'I can walk';  
  }
}
const person = Object.create(human);
person.walk(); // I can walk

в) Функция конструктора

function Human() {};
Human.prototype.walk = function () {
  return 'I can walk';
}
const person1 = new Human();
const person2 = new Human();
person1.walk(); // I can walk
person2.walk(); // I can walk

Кроме того, мы можем сделать что-то вроде этого,

function Human() {
   this.walk = function () {
        return 'I can walk'
};
const person1 = new Human();
person1.walk(); // I can walk

Но здесь есть разница. Если вы добавите его таким образом, он больше не будет методом, теперь он будет действовать как свойство. Да, когда вы сделаете «person1.walk()», вы получите тот же результат, что и раньше, без разницы. Ноесли вы захотите снова изменить эту функцию позже, вам придется изменить ее в каждом из экземпляров. это значит, что это больше не наследство.

Приведем еще один пример этого

function Human() {
   this.myAge = 28
};
const person1 = new Human();
person1  // Human { myAge: 28 }
Human.myAge = 56;  // 56
person1 // Human { myAge: 28 }

Как вы можете видеть выше, хотя я изменил «Human.mAge» и установил его на 56, возраст «person1» по-прежнему равен «28».

г) Классы

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

class Human() {
  walk () {
    return 'I can walk';
  }
}
const person1 = new Human();
const person2 = new Human();
person1.walk(); // I can walk
person2.walk(); // I can walk

если вы хотите обновить функцию для обоих экземпляров: Итак, если вы хотите изменить ее для всех «людей», которых вы добавляете, вы можете сделать это следующим образом

Human.prototype.talk = function () {
  return 'the update was done';
};

Но, допустим, у вас есть десять «лиц» и вы хотите изменить/обновить на 8-го, тогда что вы будете делать?

// let's set a specific one for person8
person8.walk = function(){ 
    alert('I dont want to walk any more');
}

Использованная литература;