ZetCode

JavaScript new 关键字

最后修改于 2025 年 4 月 16 日

在本文中,我们将展示如何使用 JavaScript 中的 new 关键字创建对象实例。new 运算符创建用户定义的对象类型或内置对象类型的实例。

new 关键字

JavaScript 中的 new 关键字用于创建具有构造函数函数的一个对象实例。与构造函数一起使用时,它会创建一个新对象并设置原型链。

new 运算符执行四个主要操作:它创建一个新的空对象,设置原型,使用给定的参数执行构造函数,并返回创建的对象(除非构造函数返回另一个对象)。

如果没有 new,构造函数将像普通函数一样,可能会修改全局对象或返回 undefined。new 关键字确保正确创建对象。

基本对象创建

以下示例演示了 new 关键字与构造函数函数的基本用法。

main.js
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 对象一起使用。

main.js
const date = new Date();
console.log(date);

const array = new Array(1, 2, 3);
console.log(array);

此示例展示了创建内置 DateArray 对象的实例。new 关键字使用提供的参数初始化这些对象。这是创建内置对象的传统方法。

$ node main.js
2025-04-16T12:34:56.789Z
[ 1, 2, 3 ]

带方法的构造函数

构造函数也可以定义所有实例都可用的方法。

main.js
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

原型方法

一种更有效的方法是将方法添加到构造函数的原型中。

main.js
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 的默认行为。

main.js
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 可能会导致意外行为。

main.js
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);

如果没有 newthis 指的是全局对象(或严格模式下的 undefined)。user1 被正确创建,但 user2 是 undefined。name 属性泄漏到全局对象。

$ node main.js
User { name: 'Alice' }
undefined
Bob

带有 new 的 ES6 类

new 关键字也与 ES6 类语法一起使用。

main.js
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 - 语言参考

在本文中,我们演示了如何使用 new 关键字在 JavaScript 中创建对象实例。

作者

我的名字是 Jan Bodnar,我是一位充满激情的程序员,拥有丰富的编程经验。自 2007 年以来,我一直在撰写编程文章。到目前为止,我撰写了 1,400 多篇文章和 8 本电子书。 我拥有超过十年的编程教学经验。

查看 所有 JavaScript 教程。