Native JS package _new function to implement the function of the new keyword

I. Preface

Well known: What if there are no objects? Then new one!

So in JS, when we new an object, what does the new keyword do inside?
Now let's analyze how the native JS works inside the new keyword.

Two. The original new

First, let's start with a new object to look at:

1 //Create a person constructor with a parameter of Name,age2 functionPerson (name,age) {3  　　  This. Name =name;4  　　  This. Age =Age ;5  　 }6 //Instantiating Objects Xiaoming7XM =NewPerson (' xiaoming ', 18);8 //print an instantiated object Xiaoming9Console.log (XM);

Printing results:

From the printed results, you can see:

When instantiating an object with the New keyword, an empty object, XM, is created first, and the empty object contains two attributes name and age, respectively, corresponding to the two properties in the constructor, and secondly we can also know that the instantiated object XM is inherited from Person.prototype, So now we can summarize what the new keyword did inside the object when it was instantiated, in fact, the new keyword internally did the following three things (the known constructor is func):

1. Creates an empty object and causes the empty object to inherit Func.prototype;
2. Executes the constructor and points this to the new object you just created;
3. Returns the new object;

Three. Encapsulating the _new function

Once we know the internal principle of the New keyword, we can encapsulate a _new function to use the same functionality as the New keyword.

The _new function needs to pass in several parameters:
First parameter: constructor function name func;
Second and subsequent arguments: parameters of the constructor

1 function_new () {2 //1. Get the first parameter in the passed in parameter, which is the constructor name Func3 varFunc =[].shift.call (arguments);4 //2. Create an empty object, obj, and let it inherit Func.prototype5 varobj =object.create (func.prototype);6 //3. Execute the constructor and point this to the empty object created by obj7 func.apply (obj,arguments)8 //4. Return the created object obj9 returnobjTen}

Four. Test the _new function

Once packaged, let's test the encapsulated _new function to see if it implements the same functionality as the native New keyword.

1 //Create a person constructor with a parameter of Name,age2 functionPerson (name,age) {3  　　  This. Name =name;4  　　  This. Age =Age ;5 }6 7 function_new () {8  　　 //1. Get the first parameter in the passed in parameter, which is the constructor name Func9  　　 varFunc =[].shift.call (arguments);Ten  　　 //2. Create an empty object, obj, and let it inherit Func.prototype One  　　 varobj =object.create (func.prototype); A  　　 //3. Execute the constructor and point this to the empty object created by obj -  　　 func.apply (obj,arguments) -  　　 //4. Return the created object obj the  　　 returnobj - } -  -  +XM = _new (person, ' xiaoming ', 18); -  +Console.log (XM);

Test results:

As seen from the test results, the function of the _new function is exactly the same as the new keyword.

Finish

Native JS package _new function to implement the function of the new keyword