js new 实现
new 操作符的实现原理
在 JavaScript 中,new 操作符用于创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。其内部实现逻辑可以拆解为以下步骤:
function _new(constructor, ...args) {
// 创建一个空对象,并将其原型指向构造函数的 prototype 属性
const obj = Object.create(constructor.prototype);
// 调用构造函数,并将 this 绑定到新创建的对象
const result = constructor.apply(obj, args);
// 如果构造函数返回了一个对象,则返回该对象;否则返回新创建的对象
return result instanceof Object ? result : obj;
}
关键步骤解析
-
创建新对象
Object.create()方法创建一个新对象,使用现有的对象(构造函数的 prototype 属性)作为新对象的原型。这一步模拟了new操作符的原型链继承机制。 -
绑定 this 并执行构造函数
通过apply方法调用构造函数,将新创建的obj作为this上下文传入,并传递参数。构造函数内部的this此时指向新对象。
-
处理返回值
如果构造函数显式返回一个对象(包括数组、函数等),则直接返回该对象;否则返回第一步创建的新对象。这是为了兼容构造函数可能有自定义返回逻辑的情况。
使用示例
function Person(name) {
this.name = name;
}
Person.prototype.sayHello = function() {
console.log(`Hello, ${this.name}!`);
};
// 使用原生 new
const p1 = new Person('Alice');
p1.sayHello(); // 输出: Hello, Alice!
// 使用模拟实现
const p2 = _new(Person, 'Bob');
p2.sayHello(); // 输出: Hello, Bob!
边界情况处理
-
构造函数无返回值
默认返回新创建的对象,与原生new行为一致。
-
构造函数返回基本类型
若返回数字、字符串等基本类型,仍会返回新对象(忽略返回值)。 -
构造函数返回对象
直接返回该对象,新创建的obj会被丢弃。
与原生 new 的差异
- 原生
new操作符的性能更高,因为它是语言底层实现。 - 某些极端情况(如构造函数为箭头函数)下行为可能不同,因为箭头函数无法绑定
this。
通过这种实现方式,可以清晰地理解 new 操作符背后的核心机制:原型链继承、this 绑定和返回值处理。





