What is an instance object prototype?
Instance object prototype: The instance object has an attribute __ proto__ that points to the prototype object of the constructor.
- The prototype of the instance object __proto__ and the prototype of the constructor are equivalent.
- Method search rule: First, check whether there is a method on the object. If there is, execute the method on the object. If there is no such method, because of the existence of __proto__, go to the constructor of the function prototype object prototype to find the method.
function Star(name,sex){
this.name=name;
this.sex=sex;
// this.sing=function(){
// console.log("我在唱歌");
// }
}
Star.prototype.sing=function(){
console.log("我在唱歌");
}
var ldh=new Star("小熊","男");
var z=new Star("小明","男");
console.log(ldh);
console.log(ldh.__proto__=== Star.prototype);
You can find that the prototype in the instance object also has the object prototype __proto__
The comparison of object prototype and prototype object is also true
constructor property
- Object prototype (_ proto ) and constructor (prototype) There is a property in the prototype object, the constructor property. We call the constructor the constructor because it refers to the constructor itself.
- The constructor is mainly used to record which constructor the object refers to, and it allows the prototype object to point back to the original constructor.
function Star(name,sex){
this.name=name;
this.sex=sex;
// this.sing=function(){
// console.log("我在唱歌");
// }
}
Star.prototype.sing=function(){
console.log("我在唱歌");
}
var ldh=new Star("小熊","男");
var z=new Star("小明","男");
console.log(ldh.__proto__.constructor);
console.log(Star.prototype.constructor);
console.log(ldh.__proto__.constructor === Star.prototype.constructor);
You can see that the specified constructor is returned
What if there are multiple prototype object methods? We can write like this
function Star(name,sex){
this.name=name;
this.sex=sex;
// this.sing=function(){
// console.log("我在唱歌");
// }
}
Star.prototype={
sing:function(){
console.log("我在唱歌");
},
study:function(){
console.log("我在学习");
}
}
var ldh=new Star("小熊","男");
var z=new Star("小明","男");
console.log(ldh.__proto__);
console.log(Star.prototype);
But there is a problem, where does the constructor attribute go?
The constructor property is overwritten. If Star.prototype={} is equal to an object, it will be overwritten.
How to solve it?
We need to manually use the constructor attribute to point back to the original constructor
Star.prototype={
constructor:Star,//指向原来的构造函数
sing:function(){
console.log("我在唱歌");
},
study:function(){
console.log("我在学习");
}
}
The constructor property comes out
Finally, let’s summarize:
- Both the instance object prototype ( proto ) and the constructor prototype object (prototype) have a property constructor. We call the constructor the constructor because it refers to the constructor itself.
- In general, the methods of the object are set in the prototype object of the constructor. If there are multiple object methods, we can assign values to the prototype object in the form of objects, but this will overwrite the original content of the constructor prototype object, so that the modified prototype object constructor no longer points to the current constructor. At this point, we can add a constructor to the modified prototype object to point to the original constructor.