前言

关键字
装饰器（decorator）

参考资料

  • 阮一峰 ECMAScript 6 (ES6) 标准入门教程 第三版（30. Decorator）：链接

    notes

装饰器（decorator）
面向对象的概念（java：注解，c#：特征），angular 大量使用，react 中也会用到。

JS 支持装饰器，并且已经成为正式标准。 由此说明，装饰器是会参与运行的，TS 不过是为我们写装饰器时提供一些类型检查。

作用
装饰器能够为某些属性、类、参数、方法提供元数据信息（metadata）。

装饰器能够带来额外的信息，可以达到分离关注点的目的。

  • 信息书写位置的问题
  • 重复代码的问题

上述两个问题产生的根源：某些信息，在定义时，能够附加的信息量有限。

metadata，元数据，描述数据的数据。

本质
在 JS 中，装饰器的本质是一个函数。

codes

  1. class User {
  2.   loginid: string = "";
  3.   loginpwd: string = "";
  4.   age: number = 0;
  5.   gender: "男" | "女" = "男";
  6. }
  8. /**
  9.  * 统一的验证函数
  10.  * @param obj
  11.  */
  12. function validate(obj: object) {
  13.   for (const key in obj) {
  14.     const val = (obj as any)[key];
  15.     // 缺少该属性的校验规则
  16.   }
  17. }

在书写 User 类时，我们能够清楚地知道一些成员的元信息。比如：loginid: string = "";
元数据需要描述的附加信息：

  • loginid 表示账号
  • loginid 要求必填
  • loginid 要求必须是3~5个字符

假设我们规定 loginid 要求具备上述这些附加信息，按照上述写法，我们是无法得知的。
而装饰器的作用就是让我们能够添加上这些附加信息。