Демистифицируем декораторы TypeScript: руководство для начинающих по расширению вашего кода

Привет, ребята! Сегодня мы собираемся погрузиться в захватывающий мир декораторов TypeScript. Если вы разработчик, желающий улучшить свой код и сделать его более мощным, декораторы — фантастический инструмент, который можно иметь в своем арсенале. Итак, давайте засучим рукава и изучим некоторые практические методы использования декораторов в TypeScript!

  1. Декоратор журналирования.
    Одним из самых простых и часто используемых декораторов является декоратор журналирования. Он позволяет автоматически регистрировать информацию о вызовах функций. Вот пример:
function log(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
  const originalMethod = descriptor.value;
  descriptor.value = function (...args: any[]) {
    console.log(`Calling ${propertyKey} with arguments: ${JSON.stringify(args)}`);
    const result = originalMethod.apply(this, args);
    console.log(`Returned value: ${JSON.stringify(result)}`);
    return result;
  };
  return descriptor;
}
class Calculator {
  @log
  add(a: number, b: number): number {
    return a + b;
  }
}
const calc = new Calculator();
calc.add(2, 3);
  1. Декоратор мемоизации.
    Мемоизация — это метод, позволяющий кэшировать результаты функции для повышения производительности. С помощью декоратора мемоизации вы можете легко применить эту оптимизацию к любой функции. Вот пример:
function memoize(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
  const originalMethod = descriptor.value;
  const cache = new Map();
  descriptor.value = function (...args: any[]) {
    const cacheKey = JSON.stringify(args);
    if (cache.has(cacheKey)) {
      console.log('Returning from cache...');
      return cache.get(cacheKey);
    }
    const result = originalMethod.apply(this, args);
    cache.set(cacheKey, result);
    return result;
  };
  return descriptor;
}
class Fibonacci {
  @memoize
  calculate(n: number): number {
    if (n <= 1) {
      return n;
    }
    return this.calculate(n - 1) + this.calculate(n - 2);
  }
}
const fib = new Fibonacci();
console.log(fib.calculate(10));
  1. Декоратор проверки:
    Декораторы также можно использовать для проверки ввода. Вы можете создать декоратор проверки, который проверяет аргументы, передаваемые функции, и гарантирует, что они соответствуют определенным критериям. Вот пример:
function validate(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
  const originalMethod = descriptor.value;
  descriptor.value = function (...args: any[]) {
    for (let arg of args) {
      if (typeof arg !== 'number') {
        throw new Error(`Invalid argument type: ${typeof arg}`);
      }
    }
    return originalMethod.apply(this, args);
  };
  return descriptor;
}
class MathUtils {
  @validate
  multiply(a: number, b: number): number {
    return a * b;
  }
}
const math = new MathUtils();
console.log(math.multiply(2, 3));

Это всего лишь несколько примеров того, как декораторы можно использовать в TypeScript для улучшения вашего кода. От ведения журнала и кэширования до проверки и т. д. Декораторы предлагают мощный способ изменить и расширить поведение ваших функций и классов.

Итак, откройте для себя мир декораторов TypeScript и поднимите свои навыки программирования на новый уровень!

Надеюсь, эта статья оказалась для вас полезной. Приятного кодирования!