当前位置：首页 > JavaScript

js new 的实现

2026-01-30 14:20:01JavaScript

new 的实现原理

在 JavaScript 中，new 操作符用于创建一个用户定义的对象类型的实例。它的内部实现可以拆解为以下几个步骤：

创建一个新的空对象
将这个空对象的原型指向构造函数的 prototype 属性
将构造函数内部的 this 绑定到这个新对象
执行构造函数内部的代码
如果构造函数返回非原始值，则返回该值；否则返回创建的新对象

手动实现 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.greet = function() {
    console.log(`Hello, my name is ${this.name}`);
};

// 使用原生 new
const p1 = new Person('Alice', 25);
p1.greet(); // Hello, my name is Alice

// 使用自定义 myNew
const p2 = myNew(Person, 'Bob', 30);
p2.greet(); // Hello, my name is Bob

特殊情况处理

如果构造函数有返回值：

返回对象时，new 会返回该对象而不是新创建的对象
返回原始值时，new 会忽略返回值，仍然返回新创建的对象

function Car(model) {
    this.model = model;
    return { custom: true }; // 返回对象
}

const c = new Car('Tesla');
console.log(c); // { custom: true } 而不是 Car 实例

function Bike(model) {
    this.model = model;
    return 123; // 返回原始值
}

const b = new Bike('Honda');
console.log(b); // Bike { model: 'Honda' } 仍然返回实例