ECMAScript 2017 引入了一个新的特性,即 new.target
,它可以让我们在构造函数中获取到当前正在使用的构造函数对象。本文将详细讨论 new.target
的使用方法和其在前端开发中的指导意义。
什么是 new.target?
在 ES2017 中,当我们使用 new
关键字创建一个实例时,会自动设置一个特殊的变量 new.target
。这个变量是一个元属性,它指向当前正在使用的构造函数对象。
例如:
-- -------------------- ---- ------- ----- ------ - ------------- - ------------------------ - - ----- --- ------- ------ - ------------- - -------- - - ----- ------ - --- --------- -- ------ ----- --- - --- ------ -- ---
在上面的代码中,当我们创建 Animal
实例时,new.target
指向 Animal
构造函数对象。而当我们创建 Dog
实例时,new.target
则指向 Dog
构造函数对象。
需要注意的是,new.target
只能在构造函数中使用,如果在其他函数或普通代码块中使用,会抛出语法错误。
new.target 的指导意义
1. 判断函数是否被作为构造函数调用
在 ES5 中,我们通常通过检查 this
是否为当前构造函数的实例来判断函数是否被作为构造函数调用。
例如:
-- -------------------- ---- ------- -------- ------------ - -- ------- ---------- -------- - ----- --- ------------- ---- -- ------ ---- ------ - --------- - ----- - ----- ------ - --- --------------
在 ES6 中,我们可以使用 class
关键字来定义类,但是在构造函数中同样需要判断函数是否被作为构造函数调用。
例如:
-- -------------------- ---- ------- ----- ------ - ----------------- - -- ------- ---------- -------- - ----- --- ------------- ---- -- ------ ---- ------ - --------- - ----- - - ----- ------ - --- --------------
使用 new.target
可以让我们更加简洁地判断函数是否被作为构造函数调用。
例如:
-- -------------------- ---- ------- ----- ------ - ----------------- - -- ------------- - ----- --- ------------- ---- -- ------ ---- ------ - --------- - ----- - - ----- ------ - --- --------------
在上面的代码中,我们通过判断 new.target
是否存在来判断函数是否被作为构造函数调用。
2. 子类继承时获取父类的构造函数对象
在 ES5 中,我们通常使用 Object.create
方法来实现继承。
例如:
-- -------------------- ---- ------- -------- -------- -- -------- ----- - ------------------ - ------------- - -------------------------------- ------------------------- - ---- ----- --- - --- ------
在 ES6 中,我们可以使用 class
关键字来定义类,并使用 extends
关键字来实现继承。
例如:
class Animal {} class Dog extends Animal {} const dog = new Dog();
在使用 extends
关键字实现继承时,子类会自动继承父类的构造函数。使用 new.target
可以让我们在子类中获取父类的构造函数对象。
例如:
-- -------------------- ---- ------- ----- ------ - ------------- - ------------------------ - - ----- --- ------- ------ - ------------- - -------- - - ----- --- - --- ------ -- ------
在上面的代码中,当我们创建 Dog
实例时,new.target
指向 Animal
构造函数对象。
总结
new.target
是 ES2017 中的一个新特性,它可以让我们在构造函数中获取到当前正在使用的构造函数对象。在前端开发中,new.target
可以用来判断函数是否被作为构造函数调用,以及在子类继承时获取父类的构造函数对象。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6506881895b1f8cacd25ab72