TypeScript 是一种由Microsoft开发的开源程序设计语言。在 TypeScript 中，装饰器是一种特殊的语法，它允许我们添加元数据，这些元数据可以表示代码的特征或者是对代码的行为进行描述。装饰器为 TypeScript 带来了许多新的特性和应用场景，接下来，我们将详细介绍 TypeScript 中的装饰器及其应用实例。
什么是装饰器
装饰器是一种特殊的语法，它可以通过添加元数据的方式来描述一个类、方法、属性或者参数的特征或行为，从而达到对代码进行注释和修饰的目的。在 TypeScript 中，装饰器是一种特殊的注释语法，它以 @ 符号开始，后面跟着装饰器名和一组 ()，其中 () 内可以包含参数。一个装饰器可以被应用到一个类、方法、属性或者参数上面。
装饰器的使用
在 TypeScript 中，装饰器主要用于修饰类、方法、属性和参数四种代码元素。我们可以通过装饰器添加一些附加的信息，例如日志、性能分析数据、数据校验等。
类装饰器
类装饰器是一种应用于类构造函数的装饰器，它可以在类的声明之前被申明。类装饰器会被 TypeScript 编译器调用，并且传递了构造函数作为其唯一的参数。类装饰器可以用来修改或替换类的定义。下面是一个简单的例子：
function log(target: any) {
console.log(target);
}
@log
class Test {
}在上面的例子中，我们定义了一个 log 装饰器，并用它来修饰 Test 类。当 log 装饰器被调用时，它会接收 Test 类的构造函数作为其唯一的参数，并将其打印出来。
方法装饰器
方法装饰器是一种应用于类方法的装饰器，它可以在方法的声明之前被申明。方法装饰器被 TypeScript 编译器调用，并传递了三个参数：
- 目标对象的原型。
- 目标方法的名称。
- 目标方法的属性描述符。
方法装饰器可以被用来用来修改或者替换类方法的实现。
-- -------------------- ---- ------- -------- ----------- ---- ----- ------- ----------- ------------------- - -------------------- ------------------ ------------------------ - ----- ---- - ---- -------- -- -
在上面的例子中，我们定义了一个方法装饰器 log，并将其应用到 Test 类的 method 方法上。当 log 装饰器被调用时，它会接收三个参数：Test 类的原型、method 方法名称，以及一个包含目标方法信息的属性描述符，我们可以利用这些信息做一些自定义的操作。
属性装饰器
属性装饰器是一种应用于类属性的装饰器，它可以在属性的声明之前被申明。属性装饰器被 TypeScript 编译器调用，并传递了两个参数：
- 目标对象的原型。
- 目标属性的名称。
属性装饰器可以用来对类属性进行修饰或者对类属性的元数据进行注释和描述。
-- -------------------- ---- ------- -------- ----------- ---- ----- ------- - -------------------- ------------------ - ----- ---- - ---- --------- ------ - --- -
在上面的例子中，我们定义了一个属性装饰器 log，并将其应用到 Test 类的 property 属性上。当 log 装饰器被调用时，它会接收两个参数：Test 类的原型和 property 属性名称，我们可以利用这些信息对 property 属性进行自定义操作。
参数装饰器
参数装饰器是一种应用于函数或方法的某个参数的装饰器。参数装饰器被 TypeScript 编译器调用，并传递了三个参数：
- 目标对象的原型。
- 目标方法的名称。
- 目标参数在函数参数列表中的索引。
参数装饰器可以用来对函数或方法的参数进行描述和修饰。
-- -------------------- ---- ------- -------- ----------- ---- ----- ------- ------ ------- - -------------------- ------------------ ------------------- - ----- ---- - ----------- ------ ------- -- -
在上面的例子中，我们定义了一个参数装饰器 log，并将其应用到 Test 类的 method 方法的 param 参数上。当 log 装饰器被调用时，它会接收三个参数：Test 类的原型、method 方法名称，以及 param 参数在函数参数列表中的索引，我们可以利用这些信息对 param 参数进行自定义操作。
装饰器的应用
在实际开发中，装饰器有很多应用场景，下面我们将以一个通用的 logging 装饰器为例，讲解装饰器在日志打印、类型检查、数据校验等方面的应用。
日志打印
通常，我们可以通过装饰器来实现一个通用的 logging 装饰器，在类或方法调用的开始和结束处打印日志，来方便调试和问题追踪。下面是一个使用装饰器打印日志的例子：
-- -------------------- ---- -------
-------- --------------- ---- ----- ------- ----------- ------------------- -
----- -- - -----------------
---------------- - -------- -- -
---------------------- ------ -----------
----- --- - -------------- -----------
---------------------- ------ ---------
------ ----
--
-
----- ---- -
--------
-------- --
-在上面的例子中，我们定义了一个 logging 装饰器，并将其应用到 Test 类的 method 方法上。当 method 方法被调用时， logging 装饰器会在方法的开始和结束处打印日志。
类型检查
在大型复杂项目中，类型检查是一个非常重要和有价值的功能。我们通常可以通过装饰器来为某个类、方法、属性或参数添加一些类型注解，来实现类型检查的功能。下面是一个简单的例子：
-- -------------------- ---- -------
-------- ------------ ---- ---- ------- ----------- ------------------- -
----- -- - -----------------
---------------- - -------- ------ ---- -------- ------ -
------------------ ------ -- -
----- ------- - ---------------------------------- ------- -----
-- -------- --- ----------- -- ------ --- --- --------------------------- -
----- --- ------------------- -------- ---- -------- -------- --------------- --- --- -------- -------
-
--
------ -------------- ------
--
-
----- ---- -
-----
------------ ------ ------- --
-在上面的例子中，我们定义了一个 type 装饰器，并将其应用到 Test 类的 method 方法上。当 method 方法被调用时， type 装饰器会对其参数进行类型检查，确保参数类型与预期类型一致。
数据校验
装饰器也可以用来进行数据校验，例如我们可以通过装饰器为某个类、属性或方法添加一些校验规则，来确保数据的格式和完整性。下面是一个简单的例子：
-- -------------------- ---- -------
-------- ---------------- ---- ---- ------- ----------- ------------------- -
----- -- - -----------------
---------------- - -------- ------ ---- -------- ------ -
----- ------- - ---------------------------------- ------- -----
------------------ ------ -- -
-- ------ -
----- --- --------------- -------- -- -----------
-
---
----- --- - -------------- ------
-- ------ -
----- --- ------------- ----- -- -----------
-
------ ----
--
-
----- ---- -
---------
-------------- ------- ------- -------- ------ -
------ -------
-
-在上面的例子中，我们定义了一个 validate 装饰器，并将其应用到 Test 类的 method 方法上。当 method 方法被调用时， validate 装饰器会对其参数进行校验，确保参数存在，并对其返回值进行校验，确保返回值非空。
总结
TypeScript 的装饰器为我们提供了一种新的语法，可以用来描述代码的特征和行为。通过装饰器，我们可以方便地为代码添加元数据和修饰，实现日志打印、类型检查、数据校验等一系列功能。在实际开发中，我们应该灵活运用装饰器，提高代码的可维护性、可读性和可扩展性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6490a5ee48841e9894ec2b9e