Изучение декораторов свойств в конструкторах TypeScript

В TypeScript декораторы позволяют изменять и расширять поведение классов, методов и свойств. Одним из распространенных вариантов использования является применение декораторов к свойствам класса внутри конструктора. В этой статье мы рассмотрим различные декораторы свойств в конструкторах TypeScript, а также приведем примеры кода.

  1. Декоратор свойства только для чтения:
    Декоратор свойства только для чтения позволяет нам пометить свойство как доступное только для чтения, предотвращая изменение его значения после его назначения. Вот пример:
function readonly(target: any, propertyKey: string) {
  const descriptor: PropertyDescriptor = {
    writable: false
  };
  Object.defineProperty(target, propertyKey, descriptor);
}
class Person {
  @readonly
  name: string;
  constructor(name: string) {
    this.name = name;
  }
}
const person = new Person("John");
person.name = "Jane"; // Error: Cannot assign to 'name' because it is a read-only property.
  1. Декоратор свойств журнала:
    Декоратор свойств журнала записывает значение свойства при каждом доступе или изменении. Вот пример:
function log(target: any, propertyKey: string) {
  let value = target[propertyKey];
  const getter = function () {
    console.log(`Getting value of ${propertyKey}: ${value}`);
    return value;
  };
  const setter = function (newValue: any) {
    console.log(`Setting value of ${propertyKey}: ${newValue}`);
    value = newValue;
  };
  Object.defineProperty(target, propertyKey, {
    get: getter,
    set: setter,
    enumerable: true,
    configurable: true
  });
}
class Car {
  @log
  brand: string;
  constructor(brand: string) {
    this.brand = brand;
  }
}
const car = new Car("Toyota");
car.brand; // Getting value of brand: Toyota
car.brand = "Honda"; // Setting value of brand: Honda
  1. Декоратор проверки свойств:
    Декоратор проверки свойств позволяет нам добавлять к свойству логику проверки. Он проверяет, соответствует ли присвоенное значение определенным критериям. Вот пример:
function validate(min: number, max: number) {
  return function (target: any, propertyKey: string) {
    let value = target[propertyKey];
    const setter = function (newValue: any) {
      if (newValue >= min && newValue <= max) {
        value = newValue;
      } else {
        throw new Error(`Invalid value for ${propertyKey}`);
      }
    };
    Object.defineProperty(target, propertyKey, {
      set: setter,
      enumerable: true,
      configurable: true
    });
  };
}
class Product {
  @validate(0, 100)
  price: number;
  constructor(price: number) {
    this.price = price;
  }
}
const product = new Product(50);
product.price = 120; // Error: Invalid value for price.

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

Не стесняйтесь экспериментировать с этими декораторами и изучать более сложные варианты использования для дальнейшего улучшения ваших проектов TypeScript.