new的实现 js
new 的实现原理
在 JavaScript 中,new 操作符用于创建一个用户定义的对象类型的实例或具有构造函数的内置对象类型的实例。其内部实现原理可以分为以下几个关键步骤:
-
创建一个空对象
首先创建一个全新的空对象,这个对象的__proto__属性会被设置为构造函数的prototype属性。 -
绑定 this 并执行构造函数
将新创建的对象作为this上下文,执行构造函数。构造函数内部的this会指向新创建的对象。 -
处理返回值
如果构造函数返回一个对象(包括数组、函数等),则new表达式的结果是这个返回的对象。如果构造函数没有显式返回对象,则返回新创建的对象。
手动实现 new
以下是一个手动实现 new 操作的函数,模拟其行为:
function myNew(constructor, ...args) {
// 创建一个新对象,并将其原型指向构造函数的 prototype
const obj = Object.create(constructor.prototype);
// 调用构造函数,绑定 this 为新对象
const result = constructor.apply(obj, args);
// 如果构造函数返回一个对象,则返回该对象;否则返回新创建的对象
return result instanceof Object ? result : obj;
}
使用示例
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.sayHello = function() {
console.log(`Hello, my name is ${this.name}`);
};
// 使用原生 new
const person1 = new Person('Alice', 25);
person1.sayHello(); // 输出: Hello, my name is Alice
// 使用手动实现的 myNew
const person2 = myNew(Person, 'Bob', 30);
person2.sayHello(); // 输出: Hello, my name is Bob
关键点说明
-
Object.create的作用
用于创建一个新对象,并将其__proto__指向构造函数的prototype属性,确保实例可以访问原型上的方法。 -
构造函数的返回值
如果构造函数返回非对象值(如原始类型或未显式返回),则忽略返回值并返回新创建的对象。如果返回对象,则以该对象为结果。
边界情况处理
如果构造函数本身没有 prototype 属性(如箭头函数),则手动实现的 myNew 会抛出错误,因为 Object.create(null) 无法继承原型方法。实际使用时应确保传入的构造函数是有效的。
const ArrowFunc = () => {};
const obj = myNew(ArrowFunc); // 抛出错误,因为箭头函数没有 prototype






