JS手写代码篇---手写 new 操作符

3、手写 new 操作符

new就是新建一个对象，new的过程主要有四个

1. 创建一个新对象：这个新对象的原型被设置为构造函数的 prototype 属性。

   Object.create()
   

2. 将新对象的 this 上下文绑定到构造函数：这样构造函数内部的 this 就指向了这个新对象。

   apply()
   

3. 执行构造函数：构造函数内部的代码被执行，通常会对新对象进行一些初始化操作。

4. 返回新对象：如果构造函数没有返回一个对象或函数，则默认返回新创建的对象；如果构造函数返回了一个对象或函数，则返回该对象或函数。

我们只要按照着四步来，就可以实现手写new

function myNew(constructor , ...args){//1、创建一个新对象：这个新对象的原型被设置为构造函数的 prototype 属性const obj = Object.create(constructor.prototype);//2、将新对象的 this 上下文绑定到构造函数//apply返回的是一个对象或者函数,如果构造函数没有返回一个对象或函数，则默认返回新创建的对象；如果构造函数返回了一个对象或函数，则返回该对象或函数。const res = constructor.apply(constructor , args);if(res && typeof res === 'object' || typeof res === 'function'){return res;}else {return obj;}
}

1. apply 方法：apply 是 JavaScript 中 Function 对象的一个方法，它允许你在一个指定的 this 值上调用函数，并传入一个数组作为参数

   function.apply(function , args) //改变function当中的this指向
   

​ 返回的是构造函数 function 的执行结果。具体来说，它返回的是构造函数内部通过 return 语句返回的值。如果构造函数内部没有显式返回一个对象或函数，那么 function.apply(obj, args) 将返回 undefined。

结果：

function Person(name , age){this.name = name;this.age = age;
}
console.log(new Person('lily' , 19))
console.log(myNew(Person , 'lily' , 19))
console.log(myNew(Array , 1,2,3))

Person(‘lily’ , 19))
console.log(myNew(Person , ‘lily’ , 19))
console.log(myNew(Array , 1,2,3))

[外链图片转存中...(img-kW8TgG9q-1747474809858)]**总结**：new的手写主要通过它实现的四个步骤进行一一实现，创建一个原型被设置为构造函数的 `prototype` 属性的对象，改变this的指向，判断新对象的类型最后进行对应的处理。