查看原文
其他

【ES6 教程】第四章 ES6类08—JavaScript new.target 元属性介绍

英文 | https://www.javascripttutorial.net
翻译 | 杨小爱


在今天的文章中,我们将一起来学习 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;}

我们可以使用 new 运算符从 Person 函数创建一个新对象,如下所示:

let john = new Person('John');console.log(john.name); // john
或者可以将 Person 作为函数调用:
Person('Lily');

因为 this 设置为全局对象,即在 Web 浏览器中运行 JavaScript 时的 window 对象,所以 name 属性被添加到 window 对象中,如下所示:

console.log(window.name); //Lily

为了帮助我们检测是否使用 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;}

现在,使用 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'); // Personlet lily = new Employee('Lily Bush', 'Programmer'); // Employee

在此示例中,new.target.name 是 new.target 的构造函数引用的人性化名称。

总结

在今天的教程中,我们学习了如何使用 JavaScript new.target 元属性来检测是否使用 new 运算符调用了函数或构造函数。希望今天的教程文章对你有用,如果你觉得有帮助的话,请记得点赞我,关注我,并将这篇教程文章分享给你的开发者朋友,也许对他也有用。

最后,感谢你的阅读,编程快乐!

学习更多技能

请点击下方公众号

您可能也对以下帖子感兴趣

文章有问题?点此查看未经处理的缓存