prototypes
in JavaScript , there are two types of prototypes: Display Prototypes (prototype) and implicit prototypes (__proto__).
__proto__(implicit prototype)
any object in JavaScript has a built-in property [[prototype]]and there is no standard way to access this built-in property before ES5, but most browsers support it through __proto __ to visit. ES5 has a Get method object.getprototypeof () for this built-in property standard .
prototype(an explicit prototype)
This is a property specific to the function object. This property is a pointer to an object that is used to contain properties and methods shared by all instances (we call this object a prototype object). The prototype object also has a property called constructor, which contains a pointer to the original constructor.
For example:
var a = {};console.log (a.__proto__);//= = = Object {...} Console.log (A.prototype);//= undefined function B () {}console.log (b.__proto__)/= = function () {[native code]}c Onsole.log (b.prototype)//= = Object {...}
Note: The __proto__ value of the object.prototype is null.
distinguishing between __proto__ and prototypedefinition
The concept of these two rankings has been explained in the above, not to repeat.
function
prototype : used to implement prototype-based inheritance and attribute sharing.
__proto__ : form the prototype chain, which is also used to implement prototype-based inheritance.
the relationship between the two
__proto__ points to the prototype of the constructor in ES5 and points to the constructorin es6 .
Summary
1. Any object (in javascript __proto__, prototype
2. Function Objects In addition to the attribute __proto__, there are properties prototype,prototype The prototype object that points to the method ( prototype ).
prototype chain
in JavaScript , each object and prototype object (prototype) has a prototype (__proto__), and the object's prototype points to the constructor (parent) 's prototype object ( Prototype), whilethe prototype object (prototype) is the archetype (__proto__) that points to theparent's prototype object (prototype), This creates a relationship that is connected through a prototype layer, which we call the prototype chain . It sounds like a mouthful, I simply drew a diagram to help you understand:
650) this.width=650; "title=" prototype chain. png "src=" https://s2.51cto.com/wyfs02/M02/9A/BC/ Wkiol1lz9dvi0vmwaaa7r6annse162.png "alt=" Wkiol1lz9dvi0vmwaaa7r6annse162.png "/>
by visible,__proto__ is the key to realize the prototype chain, and prototype is the component of the prototype chain. In addition, the __proto__ of all constructors/functions points to Function.prototype, which is an empty function.
prototype chain inheritance
when a property of an object is accessed, it is first searched inside the object, if any, it is returned to the property value, and if not found, it islooked up from theprototype object (the constructor's prototype) pointed to by the object's prototype (__proto__). If it is still not found, it continues tobe looked up from the prototype object pointed to by the prototype object (prototype) (__proto__), and so on, until it isfound and returns undefined if it is not found .
Using this idea, we direct the prototype object of the subclass to an instance of the parent class, and all instances created by the subclass inherit all the properties of the parent class, which is the prototype chain inheritance. Such as:
function parant (name, age) {this.name = name; This.age = age;} Parant.prototype.say = function () {console.log (' Hello, my name is ' + this.name);}; function Child () {}child.prototype = new parant (' pursue '), var man1 = new Child (); Man1.say (); Hello, my name is pursuevar man2 = new Child () console.log (Man1.say = = = Man2.say);//trueconsole.log (Man1.name = = = MAN2.N AME);//true
This article is from the "Front End Engineering Lion" blog, please be sure to keep this source http://xiedr.blog.51cto.com/12552842/1944101
JavaScript prototype, prototype chain, prototype chain inheritance