在 JavaScript 中，装饰器（Decorator）是一种特殊的注释，它可以被附加到类声明、方法、属性、参数上，以改变它们的行为。在 ES7 中引入了装饰器，但被标记为“实验性质”的功能。
ES6 中的类只有静态属性和实例属性，所有属性的初始化都放在 constructor 中。而 ES7 引入装饰器之后，我们可以在代码中使用装饰器来描述、修改类的行为，提供了更丰富的属性定义语法。ES7 之后的新版本，从 ES8 到 ES12 进一步扩展了元属性的内容，以更好地支持装饰器的使用。
一些问题
在 ES7 中，我们使用属性装饰器时，有一些限制。首先，我们无法在类的原型上导入模块，其次，我们无法访问类的多个实例。这是因为属性装饰器会在类加载时执行，而实例的创建是在类加载后进行的。另外，如果我们想要动态地为一个类增加一些属性，则需要使用 mixins。
ES12 中的元属性
为了解决上述问题，ES12 引入了元属性（Meta properties），它们是一种新的语法，可以让我们在装饰器中访问类的实例和原型，以及支持动态定义类的属性。
元属性包含两种：
- new.target：返回构造函数或类的引用，用于检查是否使用 new 关键字。
-- -------------------- ---- -------
-------- ------------------- -
-- ----------- --- ---------- -
----- --- ---------- ------ ----------- ---- --------
-
------ -------
-
----- ------- -
------------- -
-------------------- -- ----- --------------
-
-
----- --------------- - ---------------------
-- ---- ----- -- ------ -- -- --- ------ -- ----------- --- ----- ----- --- --- -------
----- -------- - --- ------------------- import.meta：返回关于模块本身的信息，包含有关导入和导出的信息，以及其他元数据。可以使用该元属性在装饰器中导入模块。
-- -------------------- ---- -------
-- -----------
------ ------- ----- ------- -
------------- -
-------------------- -- ----- --------------
-
-
-- --------------
------ -------- ---- ----------------
-------- ------------------- -
----- - ------------ ---- - - -------
------ ----- --------- ------- ---- -
------------- -
------------------ ------------
-
--
-
----- -------------- - ----------------------
----- -------- - --- -----------------
----------------------- -- ------ ----------示例
下面是一个例子，使用元属性来动态给类的实例增加一个属性。在这个例子里，我们定义了一个 Person 类，有一个 name 属性，我们想为这个实例动态的增加一个 age 属性。本例中，我们需要动态地创建一个 get/set 属性，因为 ES6 不支持为类添加属性。使用元属性将会变得非常方便，我们可以在装饰器中轻松地增加这个属性。
-- -------------------- ---- -------
----- ------ -
----------------- -
--------- - -----
-
-
-------- -------------- ---- -
---------- - ----
-
-------- -------------- -
------ -----------
-
-------- -------- -
------ -------- -------- -
--------------------------------------- ------ -
---- -------- -- -
------ -------------
--
---- -------- ------- -
------------ -------
--
------------- -----
---
---------- - ----
------ -------
--
-
--------
----- -------- ------- ------ --
----- ------ - --- -------------- ------
------------------------- -- ----- ----
------------------------ -- --
---------- - ---
------------------------ -- --结论
ES12 中的元属性在装饰器的使用中提供了更加方便的方式来访问类和实例，使得属性定义变得更加容易和灵活。这些元属性的引入，标志着 JavaScript 对装饰器的支持更加完善和成熟。我们可以在代码中更加方便地使用装饰器，以及更加灵活地定义类的属性和行为。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67371165317fbffedf07d035