当前位置:网站首页>JS prototype and prototype chain

JS prototype and prototype chain

2022-04-23 21:25:00 Sister Chunfeng

Constructor create object :

function Person() {
    

}
var person = new Person();
person.name = 'Kevin';
console.log(person.name) // Kevin

Person It's a constructor , We use new Created an instance object person

prototype

Each function has one prototype attribute
every last JavaScript object (null With the exception of ) Another object will be associated with it when it is created , This object is what we call prototype , Every object will be from prototype " Inherit " attribute .

function Person() {
    

}
//  Though it's written in the notes , But you have to pay attention to :
// prototype It's a function that has properties 
Person.prototype.name = 'Kevin';
var person1 = new Person();
var person2 = new Person();
console.log(person1.name) // Kevin
console.log(person2.name) // Kevin

 Insert picture description here

proto

every last JavaScript object ( except null ) All have a property , It's called proto, This property points to the prototype of the object

function Person() {
    

}
var person = new Person();
console.log(person.__proto__ === Person.prototype); // true

 Insert picture description here

constructor

Each prototype has a constructor Property points to the associated constructor The instance prototype points to the constructor

function Person() {
    

}
console.log(Person === Person.prototype.constructor); // true

 Insert picture description here

function Person() {
    

}

var person = new Person();

console.log(person.__proto__ == Person.prototype) // true
console.log(Person.prototype.constructor == Person) // true
//  By the way, learn a ES5 Methods , You can get the prototype of an object 
console.log(Object.getPrototypeOf(person) === Person.prototype) // true

Examples and prototypes

function Person() {
    

}

Person.prototype.name = 'Kevin';

var person = new Person();

person.name = 'Daisy';
console.log(person.name) // Daisy

delete person.name;
console.log(person.name) // Kevin

In this case , Let's give the example object person Added name attribute , When we print person.name When , The natural result is Daisy.

But when we delete person Of name Attribute , Read person.name, from person Can't find name The attribute will be from person The prototype of person.proto , That is to say Person.prototype Search for , Fortunately we found name attribute , The result is Kevin.

Prototype and prototype

var obj = new Object();
obj.name = 'Kevin'
console.log(obj.name) // Kevin

 Insert picture description here

Prototype chain

console.log(Object.prototype.__proto__ === null) // true

 Insert picture description here
JavaScript The properties of the object are not copied by default , contrary ,JavaScript Just create an association between two objects , such , One object can delegate access to the properties and functions of another , So it's not inheritance , The statement of entrustment is more accurate

版权声明
本文为[Sister Chunfeng]所创,转载请带上原文链接,感谢
https://yzsam.com/2022/110/202204200620163805.html