The prototype and prototype chain of JavaScript

deep understanding of JavaScript prototype chain

In JavaScript and prototype chain is a very magical thing, for most people is also the most difficult to understand the part of mastering the prototype and prototype chain is the essence of JavaScript is an important link. Today I share my understanding of JavaScript prototypes and prototype chains.

I. Classification of Objects

We think that any value or variable in JavaScript is an object, but I also need to divide the objects in JavaScript into several levels.

First object is a top citizen, which should be unquestionable, because all objects are derived indirectly or directly from it. The function is a first-class citizen and is explained below. Several such as String,array,date,number,boolean,math objects are second-class citizens. The rest are junior citizens.

　　second, the prototype prototype

First prototype is an attribute, and it is itself an object. So which ones have the attribute of prototype? In fact, all the functions in JavaScript have prototype this attribute, in turn all objects with prototype are also a function, yes, a function.

The first one I no longer confirm, mainly look at the second one. We all know object,array,date have prototype, they are functions. Yes they are also one of the functions, why do you say so? When we define an object or array, is it possible to do so var o = new Object (), a = new Array (). People who have studied Java know that new is a method of instantiating an object, but we all know that there is no real class concept in JavaScript, so we can only simulate it with functions, so it is also true that object and array are special functions if you have the above practice.

In fact, the above mentioned several citizens are basically a function, in addition to the object of the Math tool, should not have seen this new math () this way. Of course this kind of writing is also an error, so the return of the visit Math.prototype is also undefined.

　　Iii. __proto__ and prototype chain

__proto__ is a pointer, which refers to the object of the construction of its object prototype, sounds a mouthful. Give me an example.

　　

As the above code, O is an instance of object, so O's __proto__ pointer points to the prototype of the object of the construct O. The significance of this is that O can use the methods inside Object.prototype, such as ToString (), o when accessing the ToString method, first look for it on its own, if not found in the __proto__ That is, object.prototype the above search.

It can be said that almost all JavaScript objects have __proto__ such a pointer including object, let's take a look at

　　

In fact a = 1 is equivalent to a = new number (1). You can see that all the Builtin objects and the __proto__ of object are pointing to an anonymous function, and that they are actually an instance of the function, so that the function is a first class citizen.

So what is the prototype chain? We expand the a.__proto__ is the Number.prototype object, it is not the method of ToString (), but for a it is actually can call ToString method, this is the role of the prototype chain. Look at the code below.

　　

Looking at the code and the result, we go along the __proto__ of a to get to the prototype of object, which means that a call to ToString method is ultimately to access the Object.prototype tostring method. Then the prototype chain of A is composed of Number.prototype and Object.prototype, and when a accesses a method or property, it looks in its own first and then along the prototype chain, finds the call, and fails to find the error. To confirm this, we add a ToString method to the Number.prototype.

　　

You can see that a calls the Number.prototype ToString method and stops after it is found. In JavaScript, the end of the prototype chain for almost all objects is Object.prototype

　　Summary

__proto__ is the key to realize the prototype chain, and prototype is the component of the prototype chain. Finally, attach a slightly more complex prototype chain and the structure of the diagram, interested to study.

　　

Original address: http://www.cnblogs.com/alichengyin/p/4852616.html