In-depth analysis of constructor and prototype in js

When defining a function, the function itself has a prototype attribute by default. If we use the new operator to generate an object, there is no prototype attribute. Let's look at an example to illustrate this.
Copy codeThe Code is as follows:
Function a (c ){
This. B = c;
This. d = function (){
Alert (this. B );
}
}
Var obj = new a ('test ');
Alert (typeof obj. prototype); // undefine
Alert (typeof a. prototype); // object

From the above example, we can see that the prototype attribute of the Function Points to another object, which is a prototype object. Please refer

A. prototype contains two attributes: constructor and _ proto __

This constructor is our constructor a, which is easy to understand.

So what is _ proto?

This involves the concept of prototype chain:

Each object will Initialize an attribute inside it, namely _ proto __. when we access an object's attribute, if this attribute does not exist inside the object, then he will go to _ proto _ to find this attribute, and this _ proto _ will have his own _ proto __, so he will keep searching.

See the description of mozzlia.

When an object is created, its__proto__Property is set to constructing function'sprototypeProperty. For examplevar fred = new Employee();Will causefred.__proto__ = Employee.prototype;.

This is used at runtime to look up properties which are not declared in the object directly. E. g. whenfred.doSomething()Is executed andfredDoes not containdoSomething,fred.__proto__Is checked, which pointsEmployee.prototype, Which containsdoSomething, I. e.fred.__proto__.doSomething()Is invoked.

Note that__proto__Is a property of the instances, whereasprototypeIs a property of their constructor functions.

Believe it or not, let's look at the picture.

If you add alert (obj. _ proto _ = a. prototype)/true

Similarly, here we will analyze what the new operator has done.

1. Var obj = {}; that is, an object obj is initialized.
2. Obj. _ proto __= a. prototype;
3. A. call (obj); that is to say, constructing obj can also be called initializing obj.

We have transformed this example to make it more complex.
Copy codeThe Code is as follows:
Function a (c ){
This. B = c;
This. d = function (){
Alert (this. B );
}
}
A. prototype. test = function (){
Alert (this. B );
}
Var obj = function (){}
Obj. prototype = new a ('test ');
Obj. prototype. test1 = function (){
Alert (22222 );
}
Var t = new obj ('test ');
T. test (); // alert ('test ');

Let's analyze this process.

By var t = new obj ('test'); we can get t. _ proto _ = obj. prototype, but obj. prototype = new a ('test'); let's take a look.

Obj. prototype = p, p = new a ('test'); p. _ proto _ = a. prototype;

So obj. prototype. _ proto _ =. prototype, composed of t. _ proto _ = obj. prototype can produce t. _ proto __. _ proto _ =. prototype,

So the object t first looks for its prototype to see if there is a test function. If no function is found, the result is then directed to the upper-level, that is, t. _ proto _, that is, obj. the prototype is used to search for the test function, but obj. prototype does not have this function, and then you can look up. That is

T. _ proto __. _ proto _, because t. _ proto __. _ proto _ =. prototype in. this method is found in prototype and alert ('test') is output ')

From this analysis, we can draw a conclusion that the essence of js Zhongyuan chain lies in _ proto __

Let's look at a column.
Copy codeThe Code is as follows:
Function a (c ){
This. B = c;
This. d = function (){
Alert (this. B );
}
}
Var obj = new a ('test ');
Alert (obj. constructor); // function (){}
Alert (a. prototype. constructor); // function (){}

According to the above _ proto _, first, obj does not have the constructor attribute, but obj. _ proto _ = a. prototype;

A. Search for prototype, and a. prototype. constructor is a. the results of both are the same.