#middle #development #typescript #patterns #decorators #fp #oop

Декоратор. Что-то декорирует. А зачем-почему?
По своей сути обычный структурный шаблон проектирования, целью которого является просто обогащение объекта чем-либо.

Typescript, к примеру, вы можете достигнуть это следующим образом, буду как всегда показывать на животных:

  function vaccinated(target: any) {
    target.prototype.reflect = function () {
      console.log("Reflected.");
    };
  }
  
  @vaccinated
  class Animal {
    public age: number = 42;
  }
  
  const instance = new Animal();
  instance.reflect();
  

Когда и где это нужно?
- Это самый простой способ собрать подобие #chain_of_responsibility или хоть какого-то #pipe похожего оператора на классах
- В коде ваших тестов, базовую логику можно утащить туда, передавая дублирующийся код в качестве аргументов вашим декораторам

В чём плюсы?
- Легче писать #unit_testing под ваши классы, так как код становится ближе к модульности #modularity из парадигмы #fp

В чём минусы?
- Имея кривые руки, вы легко наплодите косяков вокруг `any`-типов, так как основная идея вообще избавиться от #типизация за счёт #generics

Что такое Decorator в Typescript в целом?

   // Input - просто ваш type для target
   type Decorator = (target: Input, context: {
     kind: string; // class, method, getter, setter, field, or accessor
     name: string | symbol; // имя декорируемого object
     access: { // объект отвечающий за get-ер и set-ер декорируемого object
       get?(): unknown;
       set?(value: unknown): void;
     };
     private?: boolean; // если декорируемый object является private членом класса
     static?: boolean; // если декорируемый object является static членом класса
     addInitializer?(initializer: () => void): void; // способ добавить кастомную логику до вызова конструктора
   }) => Output | void; // Output - что вы ожидаете получить
   
   // При работе с классами
   type ClassDecorator = (value: Function, context: {
     kind: "class"
     name: string | undefined
     addInitializer(initializer: () => void): void
   }) => Function | void
   

- Где ещё можно почитать?
- https://www.typescriptlang.org/docs/handbook/decorators.html
- https://blog.logrocket.com/practical-guide-typescript-decorators/
- https://dev.to/danywalls/decorators-in-typescript-with-example-part-1-m0f
- https://www.digitalocean.com/community/tutorials/how-to-use-decorators-in-typescript
- https://stackoverflow.com/questions/45160341/how-do-you-type-a-class-decorator-in-typescript
- https://ru.wikipedia.org/wiki/%D0%94%D0%B5%D0%BA%D0%BE%D1%80%D0%B0%D1%82%D0%BE%D1%80_(%D1%88%D0%B0%D0%B1%D0%BB%D0%BE%D0%BD_%D0%BF%D1%80%D0%BE%D0%B5%D0%BA%D1%82%D0%B8%D1%80%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D1%8F)

Другие простые примеры для расширения методов или полей вы можете найти используя Google, а вот более интересные примеры вы найдете в закрепленных комментариях, а именно:
- Пример #middleware за счёт #decorator в #nodejs
- Расширение #constructor без использования #prototype
- Расширение #class целиком за счёт использования #наследование #inheritance (мой любимый пример)


А если хочешь чаще читать наши публикации и быть в курсе вообще всего, то для доступа к нашим публикациям переходи в канал @digitable_blog

А еще если вам понадобилась карьерная консультация, подготовка к интервью или настройка чего-либо, то можно ознакомиться с услугами в нашем магазине https://digitable.ru

Ставьте Ваши реакции и задавайте вопросы в комментариях, они помогают стать нам лучше!

Have a fun!