装饰器是 TypeScript 中一项非常强大的功能，它可以让我们在不改变类或者方法原有结构的情况下，对其进行一些额外的操作。本文将介绍 TypeScript 中如何使用装饰器，并提供详细的示例代码和指导意义。
什么是装饰器
装饰器是一种特殊的声明，它可以附加到类声明、方法、属性或参数上，以修改类的行为。装饰器使用 @expression 的形式进行声明，其中 expression 指的是装饰器工厂函数。装饰器工厂函数会在运行时被调用，它可以返回一个函数或者一个对象，用于修改类的行为。
装饰器的分类
在 TypeScript 中，装饰器可以分为类装饰器、方法装饰器、属性装饰器和参数装饰器。
类装饰器
类装饰器用来修改类的构造函数。它可以被用来添加新的属性、方法或者修改现有的属性和方法。
-- -------------------- ---- -------
-- ----
-------- ---------------- ---- -
-- ---------
----- -------- - -------
-- --------
----- --------------- --- - -------- --------- ------ -
--------------------- -------- -- -------------------
------ -------------------- ------
--
-- --------
------------------------ - ----------------------------------
-- --------
------ ---------------
-
-- ------
---------
----- ------ -
------------------ ----- ------- --
-
----- ------ - --- ---------------
------------------------- -- -- ------上述代码中，我们定义了一个类装饰器 logClass，它会在创建类实例时输出类名。我们使用 @logClass 装饰器来修饰 Person 类。
方法装饰器
方法装饰器用来修改类的方法。它可以被用来添加新的逻辑或者修改现有的逻辑。
-- -------------------- ---- -------
-- -----
-------- ----------------- ---- ------------ ------- ----------- ------------------- -
-- -------
----- -------------- - -----------------
-- ------
---------------- - -------- --------- ------ -
-------------------- ------ -------------- ---- --------- ----------
------ -------------------------- ------
--
-- --------
------ -----------
-
----- ------ -
------------------ ----- ------- --
-- -------
----------
---------- -
------------------- -- ---- -- ---------------
-
-
----- ------ - --- ---------------
------------------ -- -- -------- ------ -------- ---- --------- --- - ------- -- ---- -- -----上述代码中，我们定义了一个方法装饰器 logMethod，它会在调用方法时输出方法名和参数。我们使用 @logMethod 装饰器来修饰 sayHello 方法。
属性装饰器
属性装饰器用来修改类的属性。它可以被用来添加新的属性或者修改现有的属性。
-- -------------------- ---- -------
-- -----
-------- ------------------- ---- ------------ ------- -
-- --------
--- ----- - --------------------
-- -------
----- ------ - ---------- -
-------------------- ----- -- -------- -----------------
------ ------
--
----- ------ - ------------------ ---- -
-------------------- ----- -- -------- -------------- -- --------------
----- - ---------
--
-- ------
----------------------------- ------------ -
---- -------
---- -------
----------- -----
------------- ----
---
-
----- ------ -
-- -------
------------
----- -------
----------------- ------- -
--------- - -----
-
-
----- ------ - --- ---------------
------------------------- -- -- -------- ----- -- -------- ----- - ------
----------- - ------
------------------------- -- -- -------- ----- -- -------- ---- -- ---- - -------- ----- -- -------- ----- - -----上述代码中，我们定义了一个属性装饰器 logProperty，它会在访问或者修改属性时输出属性名和值。我们使用 @logProperty 装饰器来修饰 name 属性。
参数装饰器
参数装饰器用来修改类的参数。它可以被用来添加新的逻辑或者修改现有的逻辑。
-- -------------------- ---- -------
-- -----
-------- -------------------- ---- ------------ ------- --------------- ------- -
---------------------- ----------------- -- ------ -------------- -- ----- -----------------------------
-
----- ------ -
------------------ ----- ------- --
---------------------- -------- ------- -
------------------------ -- ---- -- ---------------
-
-
----- ------ - --- ---------------
---------------------- -- -- ---------- - -- ------ -------- -- ----- ------- - ---- -- ---- -- -----上述代码中，我们定义了一个参数装饰器 logParameter，它会在调用方法时输出参数的位置和方法名。我们使用 @logParameter 装饰器来修饰 message 参数。
装饰器的执行顺序
在 TypeScript 中，装饰器的执行顺序是从上到下，从外到内的。也就是说，先执行类装饰器，然后执行方法装饰器、属性装饰器和参数装饰器。
总结
本文介绍了 TypeScript 中如何使用装饰器，并提供了详细的示例代码和指导意义。装饰器是一项非常强大的功能，它可以使我们在不改变类或者方法原有结构的情况下，对其进行一些额外的操作。希望读者能够通过本文了解装饰器的基本用法，并能够在实际开发中灵活运用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/653ca46f7d4982a6eb6b3c84