Javascript high-level programming - reading notes of understanding the prototype object

The first piece of code and diagrams

     function Person(){}
     Person.prototype.name = "Nic"
     Person.prototype.age = 22
     Person.prototype.job= "Software Engineer"
     Person.prototype.sayName = function(){
         alert(this.name)
     }
    var person1 = new Person();
    var person2 = new  Person();
     alert(person1.sayName == person2.sayName)     //true

 

                                                                                                                           figure 1

 

 

He began to enter the topic

       No matter what time, as long as the creation of a new function, it will create a prototype for the property function according to specific rules, this attribute points to the function prototype object. By default, all automatically obtain a prototype object constructor (the constructor) property, which is a pointer to a function where protopype property, take the above code is, Person.prototype.constructor point Person. Through this constructor we can continue to add additional prototype object properties and methods.

       After you create a custom constructor of its prototype object will get the default constructor property; As for the other methods are inherited from Object. When creating a new instance of a call to the constructor, the interior of this example contains a pointer (internal property), point constructor prototype attributes ES5 tube pointer called [[Prototype]]. Although there is no standard in the script access [[the Prototype]], but in Firefox, Safari, Chrome supports a property on each object _proto_; between the prototype object instance is present in the connection constructor, not examples exist between the constructor. Figure 1 shows the relationship between the various objects

Again a piece of code

function the Person () { 
  
} 
Person.prototype.name = "Nic" 
Person.prototype.age = 29 var PERSON1 = new new the Person ()
 var PERSON2 = new new the Person () 
person1.name = "Greg" 
Alert (person1.name)    / / "Greg" from example 
Alert (person1.name)    // "Nic" from prototype Delete person1.name 
Alert (person1.name)    // "Nic" prototype from

  Code described above, can be accessed through the object instance to the value in the prototype, but can not rewrite the value of the prototype of the object instance. If we add an attribute, and the prototype object attributes and attribute the same name, we will create in this instance the property, and that the shielding properties of the prototype, attributes can be deleted instance by delete, so let's revisit prototype properties

 

Let us come back a piece of code

function Person(){

}
var friend = new Person()
Person.prototype.sayHi = function(){
  alert("Hi")
}
friend.sayHi()   //"Hi"  (没有问题！)

Person.prototype = {
  constructor:Person,
  name:"Nic",
  sayHi:function(){
     alert(this.name)
  }
}
friend.sayHi()   //"Hi" (还是"Hi")

The above code shows two things

1. The relationship between the instance and the prototype is loosely call firend.sayHi () will first search for example, we did not find the prototype will go in search, because the connection between the instance and the prototype is just a pointer rather than a copy Therefore the prototype updates are available sayHi property,

2. If we rewrite the entire prototype object that is not the case. We know that will add a pointer to an instance of the initial prototype [[Prototype]] When you call the constructor, and modify the prototype to another object is equal to cut the link between the constructor and the initial prototype

Figure

Before rewriting the prototype object

 

 

                                                                                           figure 2

 

After rewriting the prototype object

 

                                                                                                          image 3