JavaScript new 关键字
最后修改于 2025 年 4 月 16 日
在本文中,我们将展示如何使用 JavaScript 中的 new 关键字创建对象实例。new 运算符创建用户定义的对象类型或内置对象类型的实例。
new 关键字
JavaScript 中的 new 关键字用于创建具有构造函数函数的一个对象实例。与构造函数一起使用时,它会创建一个新对象并设置原型链。
new 运算符执行四个主要操作:它创建一个新的空对象,设置原型,使用给定的参数执行构造函数,并返回创建的对象(除非构造函数返回另一个对象)。
如果没有 new,构造函数将像普通函数一样,可能会修改全局对象或返回 undefined。new 关键字确保正确创建对象。
基本对象创建
以下示例演示了 new 关键字与构造函数函数的基本用法。
function Person(name, age) {
this.name = name;
this.age = age;
}
const person1 = new Person('John', 30);
console.log(person1);
在这里,我们创建一个 Person 构造函数,并使用 new 创建一个实例。构造函数内部的 this 指的是新创建的对象。该实例具有带有提供值的 name 和 age 属性。
$ node main.js
Person { name: 'John', age: 30 }
创建内置对象
new 关键字也可以与内置 JavaScript 对象一起使用。
const date = new Date(); console.log(date); const array = new Array(1, 2, 3); console.log(array);
此示例展示了创建内置 Date 和 Array 对象的实例。new 关键字使用提供的参数初始化这些对象。这是创建内置对象的传统方法。
$ node main.js 2025-04-16T12:34:56.789Z [ 1, 2, 3 ]
带方法的构造函数
构造函数也可以定义所有实例都可用的方法。
function Car(make, model) {
this.make = make;
this.model = model;
this.getInfo = function() {
return `${this.make} ${this.model}`;
};
}
const myCar = new Car('Toyota', 'Corolla');
console.log(myCar.getInfo());
在这里,我们向 Car 构造函数添加一个方法 getInfo。使用 new Car() 创建的所有实例都将具有此方法。请注意,这会为每个实例创建一个新函数,这可能效率低下。
$ node main.js Toyota Corolla
原型方法
一种更有效的方法是将方法添加到构造函数的原型中。
function Book(title, author) {
this.title = title;
this.author = author;
}
Book.prototype.getInfo = function() {
return `${this.title} by ${this.author}`;
};
const book = new Book('1984', 'George Orwell');
console.log(book.getInfo());
通过将方法添加到原型,所有实例共享相同的函数引用。这比在构造函数中定义方法更节省内存。new 关键字确保正确设置原型链。
$ node main.js 1984 by George Orwell
从构造函数返回对象
构造函数可以返回对象,这将覆盖 new 的默认行为。
function Animal(type) {
this.type = type;
return { name: 'Override' };
}
const animal = new Animal('Dog');
console.log(animal);
如果构造函数返回一个对象,则该对象将成为 new 表达式的结果。在这里,返回的对象会覆盖默认行为。结果中未设置 type 属性。
$ node main.js
{ name: 'Override' }
省略 new (常见错误)
忘记在构造函数中使用 new 可能会导致意外行为。
function User(name) {
this.name = name;
}
const user1 = new User('Alice');
const user2 = User('Bob');
console.log(user1);
console.log(user2);
console.log(global.name);
如果没有 new,this 指的是全局对象(或严格模式下的 undefined)。user1 被正确创建,但 user2 是 undefined。name 属性泄漏到全局对象。
$ node main.js
User { name: 'Alice' }
undefined
Bob
带有 new 的 ES6 类
new 关键字也与 ES6 类语法一起使用。
class Product {
constructor(name, price) {
this.name = name;
this.price = price;
}
getDescription() {
return `${this.name} - $${this.price}`;
}
}
const product = new Product('Laptop', 999);
console.log(product.getDescription());
ES6 类是基于 JavaScript 原型的继承的语法糖。new 关键字与类和构造函数的使用方式相同。尝试在没有 new 的情况下调用类会抛出错误。
$ node main.js Laptop - $999
来源
在本文中,我们演示了如何使用 new 关键字在 JavaScript 中创建对象实例。