装饰器 | Decorator | Shelton Blog

1. TypeScript 中的装饰器(Decorators)

1. 类装饰器(Class Decorators)

类装饰器通常用于增强或修改类的行为.它是作用于类构造函数的装饰器.

function Logger(target: Function) {
  console.log(`Class ${target.name} is being created`);
}

@Logger
class Person {
  constructor(public name: string) {}
}

// 控制台输出：Class Person is being created
const p = new Person('John');

2. 方法装饰器(Method Decorators)

用法：

性能监控：记录方法的调用时间.
日志记录：自动记录方法执行的情况.
权限控制：在方法执行前进行权限检查.

function Log(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
  const originalMethod = descriptor.value;
  descriptor.value = function (...args: any[]) {
    console.log(`Calling ${propertyKey} with arguments: ${args}`);
    const result = originalMethod.apply(this, args);
    console.log(`Result of ${propertyKey}: ${result}`);
    return result;
  };
}

class Calculator {
  @Log
  add(a: number, b: number) {
    return a + b;
  }
}

const calc = new Calculator();
calc.add(2, 3); // Logs: Calling add with arguments: [2, 3]
              // Logs: Result of add: 5

3. 访问器装饰器(Accessor Decorators)

访问器装饰器可以修改类属性的 getter 和 setter 行为.它接受和方法装饰器相似的参数.

用法：

数据校验：验证赋值的值是否合法.
计算属性：修改属性的读取行为.

function validate(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
  let value: number;
  const getter = () => value;
  const setter = (newValue: number) => {
    if (newValue < 0) {
      console.error('Value must be greater than or equal to 0');
    } else {
      value = newValue;
    }
  };

  Object.defineProperty(target, propertyKey, {
    get: getter,
    set: setter,
  });
}

class Product {
  private _price: number;

  @validate
  set price(value: number) {
    this._price = value;
  }

  get price() {
    return this._price;
  }
}

const prod = new Product();
prod.price = -10; // Logs: Value must be greater than or equal to 0
prod.price = 100; // Sets the price to 100

4. 属性装饰器(Property Decorators)

装饰器是 TypeScript 中的一种特殊类型的声明,它允许你通过一个函数来修改类、方法、属性或参数的行为.装饰器通常用于元编程.

function log(target: any, key: string) {
  let value: any;
  const getter = () => {
    console.log(`Getting value of ${key}: ${value}`);
    return value;
  };
  const setter = (newValue: any) => {
    console.log(`Setting value of ${key}: ${newValue}`);
    value = newValue;
  };
  Object.defineProperty(target, key, { get: getter, set: setter });
}

class Person {
  @log
  name: string;

  constructor(name: string) {
    this.name = name;
  }
}

const p = new Person("Alice");
p.name = "Bob"; // 输出：Setting value of name: Bob
console.log(p.name); // 输出：Getting value of name: Bob

2. Decorator实现

以记录定时任务需求(高阶函数实现参考)为例, 演示装饰器的使用

1. 创建方法装饰器

import cron from "node-cron";
import { MongoClient } from "mongodb";

const client = new MongoClient("mongodb://localhost:27017");
const db = client.db("cron_logs");
const logsCollection = db.collection("task_logs");

function LogTaskExecution(taskName) {
  return function (_, __, descriptor) {
    const originalMethod = descriptor.value;
    descriptor.value = async function (...args) {
      const startTime = new Date();
      console.log(`[${taskName}] Task started at:`, startTime.toISOString());
      
      const logEntry = { taskName, startTime, status: "running" };
      const logId = (await logsCollection.insertOne(logEntry)).insertedId;

      try {
        await originalMethod.apply(this, args);
        const endTime = new Date();
        console.log(`[${taskName}] Task completed successfully at:`, endTime.toISOString());
        await logsCollection.updateOne({ _id: logId }, { $set: { endTime, status: "success" } });
      } catch (error) {
        const endTime = new Date();
        console.error(`[${taskName}] Task failed at:`, endTime.toISOString(), "Error:", error);
        await logsCollection.updateOne({ _id: logId }, { $set: { endTime, status: "failed", error: error.message } });
      }
    };
    return descriptor;
  };
}

class TaskScheduler {
  @LogTaskExecution("CheckOfficialAccountUpdate")
  async checkOfficialAccountUpdate() {
    console.log("Checking official account update...");
  }
}

const scheduler = new TaskScheduler();
cron.schedule("01 09,14 * * *", () => scheduler.checkOfficialAccountUpdate());