Javascript: прототип

Javascript: прототип

Прототип - это свойство любой функции JavaScript, которая указывает на объект.

# Начнем с очень простого примера

function Student() {
    this.name = 'Harry';
    this.gender = 'Potter';
}
var studObj1 = new Student();
stdObj1.age = 15;
console.log(stdObj1.age); 
// 15
var stdObj2 = new Student();
console.log(stdObj2.age); 
// undefined

Как вы можете видеть в приведенном выше примере, свойство age прикреплено к экземпляру stdObj1. Однако у экземпляра stdObj2 не будет свойства age, поскольку оно определено только в экземпляре studObj1. Итак, что делать, если мы хотим добавить новые свойства на более позднем этапе к функции, которая будет использоваться всеми экземплярами? Ответ: Прототип.

function Student() {
    this.name = 'Harry';
    this.gender = 'Potter';
}
Student.prototype.age = 15;
var studObj1 = new Student();
console.log(studObj1.age); 
// 15
var studObj2 = new Student();
console.log(studObj2.age);
 // 15

# Как вы можете видеть в приведенном выше примере, к свойству prototype функции можно получить доступ с помощью ‹function-name› .prototype. Однако объект (экземпляр) не предоставляет свойство прототипа, вместо этого вы можете получить к нему доступ, используя __proto__

function Student() {
    this.name = 'Tom';
    this.gender = 'Cruise';
}
var studObj = new Student();
console.log(Student.prototype); 
// [object Object]
console.log(studObj.prototype); 
// undefined
console.log(studObj.__proto__); 
// [object Object]
console.log(typeof Student.prototype); 
// object
console.log(typeof studObj.__proto__); 
// object

### Изменение прототипа

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

function Student() {
    this.name = 'Tom';
    this.gender = 'Male';
}
Student.prototype.age = 15;
var studObj1 = new Student();
console.log('studObj1.age = ' + studObj1.age);
 // 15
var studObj2 = new Student();
console.log('studObj2.age = ' + studObj2.age);
 // 15
Student.prototype = { age: 20 };
var studObj3 = new Student();
console.log('studObj3.age = ' + studObj3.age);
 // 20
console.log('studObj1.age = ' + studObj1.age);
 // 15
console.log('studObj2.age = ' + studObj2.age);
 // 15

### Использование прототипа

Объект-прототип используется движком JavaScript для двух целей: 1) для поиска свойств и методов объекта 2) для реализации наследования в JavaScript.

function Student() {
    this.name = 'Robert';
    this.gender = 'Pattinson';
}
Student.prototype.sayHi = function () {
    console.log("Hi");
};
var studObj = new Student();
studObj.sayHi();
// Hi

### Поделиться методом с помощью прототипа

function Person(name, age){
    name = name;
    age= age;
}
Person.prototype = {
    eat(){
        console.log('Person is eating');
    },
    sleep(){
        console.log('Person is sleeping');
    },
    play(){
        console.log('Person is playing');
    }
}
const harry = new Person("Harry", 36);
harry.eat();
//Person is eating