js手写new实现过程
手写实现 JavaScript 的 new 操作符
new 操作符在 JavaScript 中用于创建一个用户定义的对象类型的实例。以下是手动实现 new 操作符的步骤:
实现步骤
-
创建一个新对象
使用Object.create()方法以构造函数的原型对象作为新对象的原型。这一步确保新对象继承构造函数原型上的属性和方法。 -
绑定
this并执行构造函数
将构造函数的作用域绑定到新对象上,并执行构造函数。构造函数内部的this会指向新创建的对象。 -
处理构造函数返回值
如果构造函数返回一个对象(非原始值),则返回该对象;否则返回新创建的对象。
代码实现
function myNew(constructor, ...args) {
// 创建一个新对象,继承构造函数的原型
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(constructor.prototype)确保新对象继承构造函数的原型链。apply方法用于调用构造函数并绑定this到新对象。- 检查构造函数返回值是否为对象,以决定返回结果。
边界情况处理
- 如果构造函数返回原始值(如
number、string),仍然返回新对象。 - 如果构造函数返回另一个对象,则直接返回该对象。
这种实现方式模拟了原生 new 操作符的行为,涵盖了原型继承、this 绑定和返回值处理等核心功能。







