Before we actually implement new, let’s focus on what the new operator does. We can only implement the new operator ourselves if we really understand what the new operator does.

What the new operator does

There is no point in talking, let’s try to see by practical example

function Student (name, age){
    this.name = name;
    this.age = age;
}
Student.prototype.id = '110'
let hanson = new Student('hanson'.18);
console.log(hanson.name); // 'hanson'
console.log(hanson.id)  / / 110
Copy the code

This code is very basic and understandable, but it also explains the new operator better:

  1. A new instance object is created.
  2. The object’s __proto__ property is identical to the prototype of the constructor (hanson.__proto === student.prototype).
  3. Change this to point to the newly created instance object

That is, instance objects implemented with the new operator can access properties of the constructor as well as properties on the constructor prototype.

Implement our own new function

// Code implementation style
function Student (name, age){... }// With the new function
let hanson1 = new Student(...)
// Create a new myNew function and implement the new function yourself
let hanson2 = myNew(Student,...)
Copy the code

Implement our own new function

function myNew(){
    const obj = new Object(a); Constructor =Array.prototype.shift.call(arguments);
    obj.__proto__ = Constructor.prototype;
    Constructor.apply(obj,arguments);
    return obj;
}
Copy the code

The explanation above:

  1. Create a new object and return. Conforms to the function of the new function.
  2. Intercepts the first argument passed to myNew.
  3. Associate the prototype of the first parameter with the object to return.
  4. Using apply, change the constructor’s this to point to the new object so that obj can access the properties in the constructor.
  5. Returns the obj.

Note: If you don’t already know about prototype functions, click Inherit to learn about them.

Have a try

function Student (name, age){
    this.name = name;
    this.age = age;
}
function myNew(){
    const obj = new Object(a); Constructor =Array.prototype.shift.call(arguments);
    obj.__proto__ = Constructor.prototype;
    Constructor.apply(obj,arguments);
    return obj;
}
let newPerson = myNew(Student,'hanson'.18);
console.log(newPerson.name) // hanson
Copy the code

The result is the same as the result of the new operator!

Have you finished?

function Student (name, age){
    this.class= '3.5';
    return {
        name:name,
        age:age
    }
}

let newPerson = new Student('hanson'.18)
console.log(newPerson.name) // hanson
console.log(newPerson.class) // undefined

Copy the code

If the constructor returns a value, only the object returned by the constructor is returned.

function myNew(){
    const obj = new Object(a); Constructor =Array.prototype.shift.call(arguments);
    obj.__proto__ = Constructor.prototype;
    let ret = Constructor.apply(obj,arguments); // Check whether the constructor has a return value
    return typeof ret === 'object'? ret : obj;
}
Copy the code

Normally, constructors do not return values, but who can say for sure?

Don’t forget to like this article if it’s helpful to you