JavaScript new.target 元属性介绍

摘要: 本教程将介绍 JavaScript new.target 元属性，它可以检测函数或构造函数是否使用 new 运算符调用。

JavaScript new.target 简介

ES6 提供了一个名为 new.target 的元属性，允许您检测函数或构造函数是否使用 new 运算符调用。

new.target 由 new 关键字、一个点和 target 属性组成。new.target 在所有函数中都可用。

但是，在箭头函数中，new.target 属于周围函数。

new.target 在运行时检查函数是否作为函数或构造函数执行非常有用。它也有助于确定从父类中使用 new 运算符调用的特定派生类。

JavaScript new.target 在函数中

让我们看看以下 Person 构造函数

function Person(name) {
    this.name = name;
}Code language: JavaScript (javascript)

您可以使用 new 运算符从 Person 函数创建新对象，如下所示

let john = new Person('John');
console.log(john.name); // johnCode language: JavaScript (javascript)

或者您可以将 Person 作为函数调用

Person('Lily');Code language: JavaScript (javascript)

因为 this 被设置为全局对象，即当您在 Web 浏览器中运行 JavaScript 时，window 对象，因此 name 属性将添加到 window 对象中，如下所示

console.log(window.name); //LilyCode language: JavaScript (javascript)

为了帮助您检测函数是否使用 new 运算符调用，您可以使用 new.target 元属性。

在常规函数调用中，new.target 返回 undefined。如果函数是用 new 运算符调用的，new.target 将返回对该函数的引用。

假设您不希望 Person 被调用为函数，您可以使用 new.target，如下所示

function Person(name) {
    if (!new.target) {
        throw "must use new operator with Person";
    }
    this.name = name;
}Code language: JavaScript (javascript)

现在，使用 Person 的唯一方法是通过使用 new 运算符从它实例化一个对象。如果您尝试像常规函数一样调用它，您将遇到错误。

JavaScript new.target 在构造函数中

在类构造函数中，new.target 指向由 new 运算符直接调用的构造函数。如果构造函数在父类中并且是从子类的构造函数中委托的，则它为 true

class Person {
    constructor(name) {
        this.name = name;
        console.log(new.target.name);
    }
}

class Employee extends Person {
    constructor(name, title) {
        super(name);
        this.title = title;
    }
}

let john = new Person('John Doe'); // Person
let lily = new Employee('Lily Bush', 'Programmer'); // EmployeeCode language: JavaScript (javascript)

在本例中，new.target.name 是 new.target 的构造函数引用的用户友好名称

在本教程中，您学习了如何使用 JavaScript new.target 元属性来检测函数或构造函数是否使用 new 运算符调用。

本教程是否有帮助？