Principles of new operators for JavaScript beginners

This article is an article on theoretical speculation. If there is any inaccuracy, please correct it. For more information, please declare the source. Thank you!

Original article: http://blog.csdn.net/softmanfly/article/details/34833931

There is no difference between constructors and common functions in JavaScript. constructors can be used as common functions, while common functions can also use new to simulate the call of constructor, however, the difference between a common function and a constructor lies in the internal principle of the new operator. below is the execution process of the new operator I tested and guessed, when you use the new operator to generate an object, you may perform the following operations:

To Constructor

Function Person (name ){

This. name = name

This. sayName = function (){

Alert (this. name );

}

}

For example:

(1) create an object var object = {};

(2) then set the scope of the constructor to object so that the this pointer can be used. The specific operation may be as follows:

Person. apply (object, name );

(3) execute the specific code in the constructor. Because the applied scope in the previous step is object, when this. when name = name, the executor first looks for whether the object has the name attribute. If there is no name attribute, the executor adds a name attribute and assigns a value to it.

(4) return the created object;

(5) After the constructor is executed, the this pointer in the constructor object (note the wording) becomes undefined. When this function is called again, the executor first checks whether the this pointer in this function has a value. If there is no value, it will go to the upper level of the scope chain to find the value of this pointer until it finds this pointer. If this paragraph is hard to understand, you can refer to the following code:

Var p = new Person ("cat ");

Window. sayName = p. sayName;

Window. sayName ();

The final output is undefined. Why?

Because when window. when sayName is used, alert must have one this. name: The executor first looks for whether the this attribute in the sayName function has a value. The result shows that there is no value, and then looks for the this pointer of the caller window object. this of window points to the window object itself, but unfortunately, the window does not have the name attribute. If you add var name = "Dog" to the window scope, the above Code will output dog instead of cat. this is a search process of the this pointer.

If you call window. sayName = p. sayName. bind (p); then call window. if sayName is used, the output is cat, Because you bind the this pointer of A New sayName object (because the bind returns a new object) to the p object, that is, this points to the p object. When you call window. when sayName () is searched, the this pointer of the sayName function object is no longer undefined, but p, and then cat is output directly.