In the general concept of object-oriented languages, there are class (class), the class is an instance of an object template, the object is to class.
But it is not defined in the class (all things are the object) in the js. Digression: But ES6 provided in a language closer to the traditional wording, the introduction of the Class (class) concept as a template object. By class keyword, you can define classes.
In order to establish contact (such as inheritance), initially implemented by the constructor (constructor) directly at the object. But there is a drawback constructor, that is the same between an object instance can not be shared properties. as follows:
1 function Person(name,height){ 2 this.name=name; 3 this.height=height; 4 this.hobby=function(){ 5 return 'watching movies'; 6 } 7 } 8 var boy=new Person('aa',180); 9 var girl=new Person('bb',153); 10 console.log(boy.name); //'aa' 11 console.log(girl.name); //'bb' 12 console.log(boy.hobby===girl.hobby); //false
Boy and girl above code is not the same hobby. In other words, every time you use the new constructor to call back in an object instance, that they will create a hobby method. This is not only unnecessary, but also a waste of resources, because all hobby methods are the same behavior can be two shared object instance.
In order to solve the drawbacks of the properties can not be shared between the object instance constructor, js provided a prototype property, i.e. the introduction of the concept of the prototype chain.
Here we get to the point:
That prototype prototype property constructor, for example of the constructor accessible through __proto__. For the constructor, it is an attribute for the object instance, it is a prototype object.
First clear: function (Function) have a prototype property, the object (except Object) with only __proto__.
On a direct relationship constructor example, prototypes, word does not say, directly on the map:
Which it is to be noted that the Function js first-class citizens, all functions are Function examples:
① local object: independent of the host environment (browser) objects - including the Object, Array, Date, RegExp, Function, Error, Number, String, Boolean
② built-in objects - including Math, Global (window, in the js is a global variable), use of the time do not need new
③ host object - including custom objects, DOM, BOM
After completion appreciated that the structure, look at the code:
1 function Person(name,height){ 2 this.name=name; 3 this.height=height; 4 } 5 Person.prototype.hobby=function(){ 6 return 'watching movies'; 7 } 8 var boy=new Person('aa',180); 9 var girl=new Person('bb',153); 10 console.log(boy.name); //'aa' 11 console.log(girl.name); //'bb' 12 console.log(boy.hobby===girl.hobby); //true
The hobby is consigned to the prototype object, the two objects share the same instance of a method.
Wherein the properties of the prototype object attribute is not an object instance. Property is inherited from object instance constructor defined attributes, functions as an internal structure of a key to point to this instance of the object to be generated.
Properties of the object instance is actually inside the constructor defined attributes. Just modify the properties and methods on the prototype object, change will be immediately reflected in all object instances.
Chain prototype (prototype chains)
Properties and methods of an object, there may be defined in its own, there may be defined in its prototype object. Since the prototype object itself is also an object instance of the object, it has its prototype, the prototype is formed of a chain (prototype chain).
That is by the far right of the picture line fun -> Fun () of the prototype -> Object's prototype
All prototypes top all objects are Object.prototype, that object that is the prototype property Object constructor points.
Of course, Object.prototype the object has its own prototype object, any object that is not null attributes and methods, and the null object does not have its own prototype.
the console.log (Object.getPrototypeOf (Object.prototype)); // null getPrototypeOf to return Objiect.prototype prototype object point (i.e. .__ proto__ Object.prototype) the console.log (Person.prototype.isPrototypeOf (Boy)) / / to true isPrototypeOf Person.prototype used to determine whether the prototype chain (not just only one prototype) in the boy
Prototype chain (prototype chain) features are:
a: When reading an attribute of an object, JavaScript engine to find the properties of the object itself, if not, go on to its prototype, if this fails, go on to the prototype of the prototype. If until the topmost Object.prototype still not found, returns undefined.
b: If the object itself and its prototype, defines a property of the same name, then the priority read object's own properties, this is called "covering" (overiding).
c: one level up in the prototype chain looking for a property, the performance is influential. Looking for property in the upper layer of the prototype object, the greater the impact on performance. If looking for a property that does not exist, it will traverse the entire prototype chain.
Another problem is the prototype of how to generate it? In fact, achieved by the new keyword.
Here it should be clear function (Function) have a prototype property, the object (except Object) with only __proto__.
This is why an instance constructor of a custom no prototype property of the individual that is Function within the definition was written protoytpe property (the object) for examples of inheritance.
Here is the operation of the new keyword:
var obj = {}; obj .__ proto__ = Base.prototype; // we will __proto__ member of this prototype object obj points to attributes (member objects) object constructor Base Base.call (obj); // if by when the prototype chain of calls to the prototype member objects Base object's attributes, this pointer is still execute obj
Structure study is completed, its role and use its functions to achieve a variety of inheritance still learning.
Personal summary log, if any similarities, because your article written particularly well, learn a little, but also forgot to forgive me.