Learn JavaScript object-oriented Understanding JavaScript Prototype and prototype chain _JAVASCRIPT skills

First look at a picture, comb and comb.

I. Basic CONCEPTS　
The prototype chain has an object for each constructor, and the prototype object contains a pointer to the constructor, and the instance contains an internal pointer to the prototype object. So, if the prototype object equals another instance of the prototype, then the prototype object will contain a pointer to another prototype, and, correspondingly, a pointer to another constructor is included in the other prototype. If another prototype is an instance of another prototype, the relationship is still valid. Such layers of progression form the chain of examples and prototypes.
The "prototype object" object contains properties and methods that can be shared by all instances of a particular type. All reference types inherit object by default, and this inheritance is also implemented through a prototype chain. The default prototypes for all functions are instances of object, so the default stereotype contains an internal pointer to Object.prototype, which is why all custom types inherit the ToString (), valueof () method
The difference between the constructor constructor and other functions is that they are invoked in a different way. In general, a function can be used as a constructor if it is called by the new operator, and it will not be the same as a normal function if it is not invoked through the new operator.
[note] user-defined functions and built-in constructors in JavaScript can be used as constructors
The constructor constructor should always start with an uppercase letter, not a constructor that starts with a lowercase letter. This approach is drawn from other OO languages, primarily to distinguish them from other functions in ECMAScript, because the constructor itself is a function, but it can be used to create objects.
"Three usage scenarios for constructors"
[A] used as a constructor

var person = new Person ("Nicholas", "Software Engineer");
Person.sayname ();

[b] called as a normal function

Person ("Greg", "Doctor");//Add to Window
window.sayname ();//"Greg"

[C] is called in the scope of another object

var o = new Object ();
Person.call (O, "Kristen", "Nurse");
O.sayname ()//"Kristen"

"Prototype Property"As soon as a new function is created, a prototype property is created for the function based on a specific set of rules, which points to the prototype object of the function.
[note] Only functions have prototype properties, object has no prototype property
"Constructor Property"By default, all prototype objects will automatically get a constructor (constructor) property that contains a pointer to the function where the prototype property is located
[note] After the custom constructor has been created, its prototype object will only get the constructor property, and the other methods are inherited from Object
"_proto_ and [[prototype]]"When the constructor is called to create a new instance, the internal of the instance will contain a pointer (internal property) that points to the stereotype object of the constructor. ECMA-262 5th Edition Tube This pointer is called [[prototype]]. Although [[prototype]] is accessed in a standard way in scripts, Firefox\safari\chrome supports a property _proto_ on each object, and in other implementations, this property is completely invisible to the script. This connection exists between the instance and the stereotype object of the constructor, not between the instance and the constructor
second, the basic operation
"prototype chain query"Whenever the code reads a property of an object, it performs a search, with the target being a property with the given name. The search starts first from the object instance itself, if a property with the given name is found in the instance, the value of the property is returned, or if it is not found, continues the search for the prototype object to which the pointer points, looks for a property with the given name in the prototype object, and returns the value of the property if it is found.
"Add instance Properties"When you add a property to an object instance, the This property masks the attributes of the same name saved in the prototype object; in other words, adding this property will only prevent us from accessing that property in the prototype, but not modifying that property, even if this property is set to NULL, and it will only be set in the instance. The connection to the prototype is not restored. However, using the delete operator allows you to completely remove the instance properties, allowing us to regain access to the properties in the prototype.
"The dynamics of the archetype"Since the process of looking up a value in a prototype is a search, any changes we make to the prototype object are immediately reflected from the instance, even if the instance is created first and then the prototype is modified.
[note] It is not recommended to modify the prototype of a native object in a production program

function person () {};
var friend = new person ();
Person.prototype.sayHi = function () {
  alert (' Hi ');
}
Friend.sayhi ()//"HI"  

overriding a stereotype calls a constructor to add a [[prototype]] pointer to the original prototype, and modifying the stereotype to another object is tantamount to cutting off the relationship between the constructor and the original prototype. The pointer in the instance points only to the stereotype, not to the constructor.
Iii. Basic Methods
[1]isprototypeof (): To determine whether the instance object and the prototype object exist in the same prototype chain, as long as the prototype in the prototype chain, can be said to be the prototype chain derived from the prototype of the instance

function person () {};
var person1 = new Person ();
var person2 = new Object ();
Console.log (Person.prototype.isPrototypeOf (Person1));//true
Console.log (Object.prototype.isPrototypeOf ( Person1));//true
Console.log (Person.prototype.isPrototypeOf (Person2));//false
Console.log ( Object.prototype.isPrototypeOf (Person2));//true

[2] ECMAScript5 New Method Object.getprototypeof (): This method returns the value of [[Prototype]]

function person () {};
var person1 = new Person ();
var person2 = new Object ();
Console.log (object.getprototypeof (Person1)); person{}
Console.log (object.getprototypeof (person1) = = Person.prototype);//true
Console.log ( Object.getprototypeof (person1) = = = Object.prototype); False
Console.log (object.getprototypeof (Person2));//object{}  

[3]hasownproperty (): detects whether a property exists in the instance

function person () {
  Person.prototype.name = ' Nicholas ';
}
var person1 = new Person ();
There is no instance, but there is
console.log ("name") in the prototype Person1.hasownproperty,//false
//No instances, no prototypes
Console.log (Person1.hasownproperty ("no"));//false
person1.name = ' Greg ';
Console.log (person1.name);//' Greg '
console.log (person1.hasownproperty (' name '));//true
Delete Person1.name;
Console.log (person1.name);//"Nicholas"
console.log (Person1.hasownproperty (' name '));//false  

[4] ECMAScript5 object.getownpropertydescriptor (): Can only be used to get the descriptor of the instance property, to obtain the descriptor of the prototype property, The Object.getownpropertydescription () method must be invoked directly on the prototype object

function person () {
  Person.prototype.name = ' Nicholas ';
}
var person1 = new Person ();
Person1.name = ' Cook ';
Console.log (Object.getownpropertydescriptor (Person1, "name");//object {value: "Cook", Writable:true, Enumerable: True, configurable:true}
Console.log (Object.getownpropertydescriptor (Person.prototype, "name"));//object { Value: "Nicholas", Writable:true, Enumerable:true, configurable:true}

[5]in operator: Returns True when an object is able to access a given property, whether it exists in an instance or in a prototype

function person () {}
var person1 = new Person ();
Person1.name = ' Cook ';
Console.log ("name" in Person1),//true
console.log ("name" in Person.prototype),//false
var person2 = new Person ();
Person.prototype.name = ' Cook ';
Console.log ("name" in Person2);//true
console.log ("name" in Person.prototype);//true

[6] using both the hasOwnProperty () method and the in operator to determine whether the attribute exists in the instance

hasOwnProperty () returns false and the In operator returns TRUE, the function returns True, which is determined to be a property
function Hasprototypeproperty (object,name) in the prototype {
  return!object.hasownproperty (name) && (name in object);
}
function person () {
  Person.prototype.name = ' Nicholas ';
}
var person1 = new Person ();
Console.log (Hasprototypeproperty (person1, ' name '));//true
person1.name = ' Cook ';
Console.log (Hasprototypeproperty (person1, ' name '));//false
delete person1.name;
Console.log (Hasprototypeproperty (person1, ' name '));//true
delete Person.prototype.name;
Console.log (Hasprototypeproperty (person1, ' name '));//false

[7] ECMAScript5 Object.keys () method: Receives an object as an argument and returns an array of strings containing all enumerable properties
[note] Be sure to new the instance object before using the method, otherwise null

function person () {
  Person.prototype.name = ' Nicholas ';
  Person.prototype.age =;
  Person.prototype.job = ' Software Engineer ';
  Person.prototype.sayName = function () {
    alert (this.name);
  }  
};
var keys = Object.keys (Person.prototype);
Console.log (keys);//[]
var p1 = new Person ();
P1.name = "Rob";
P1.age =;
var keys = Object.keys (Person.prototype);
Console.log (keys);//["Name", "Age", "job", "Sayname"]
var p1keys = Object.keys (p1);
Console.log (P1keys);//["Name", "Age"

[8] ECMAScript5 Object.getownpropertynames () method: Receives an object as an argument and returns an array of strings containing all the attributes
[note] Be sure to new the instance object before using this method, otherwise only constructor

function person () {
  Person.prototype.name = ' Nicholas ';
  Person.prototype.age =;
  Person.prototype.job = ' Software Engineer ';
  Person.prototype.sayName = function () {
    alert (this.name);
  }  
};
var keys = object.getownpropertynames (Person.prototype);
Console.log (keys);//["constructor"]
var p1 = new Person ();
var keys = object.getownpropertynames (Person.prototype);
Console.log (keys);//["Constructor", "name", "Age", "job", "Sayname"

I hope this article will help you learn about JavaScript programming.