JavaScript – делаем код чище с использованием декораторов - Блог ITVDN
ITVDN: курсы программирования
Видеокурсы по
программированию

    Выбери свою IT специальность

    Начать бесплатно

    Выбери свою IT специальность

    Начать бесплатно

      JavaScript – делаем код чище с использованием декораторов

      бесплатное обучение для украинцев LIVE ONLINE FRONTEND DEVELOPER

      Работая с JavaScript, вам иногда нужно использовать функцию ‘setTimeout’, чтобы выполнить фрагмент кода в следующем tick. Если вы работаете, например, с Angular, то, скорее всего, уже знакомы с чем-то подобным.

      Пример ‘setTimeout’ “hack”:

      Назовите меня психом, но я терпеть не могу писать код подобным образом, особенно когда ‘setTimeout’ не то, что мне сейчас надо. Давайте сделаем проще. Попробуем превратить функцию ‘setTimeout’ в Декоратор.

      Создадим метод Декоратор с названием ‘timeout’, чтобы код был чище.

      В typescript или babel-метод Декоратор - это просто функция, имеющая три параметра.

      Цель: или функция-конструктор класса для static member, или прототип класса для instance member.

      Ключ: имя member.

      Дескриптор: свойство Дескриптора для member.

      В нашем случае нужно передать аргумент декоратору (количество миллисекунд, которое по умолчанию будет равно нулю), так что будем использовать Decorator Factory.

      Decorator Factory – это простая функция, которая возвращает выражение, которое будет вызвано декоратором в рантайме.

      Дальше, получаем ссылку на оригинальный метод из значения свойства дескриптора.

      Потом переопределяем исходное значение и создаем новую функцию, которая оборачивает исходную с ‘setTimeout’.

      Теперь можем использовать наш декоратор следующим образом:

      Так намного лучше и вы не будете спорить, что выглядит круче.

      В итоге:  

      Вы можете использовать декораторы и создавать с ними крутые приложения. Декораторы существуют не только для frameworks или библиотек, так что будьте креативными и используйте их.

      Оригинальная статья на английском языке. 

      КОММЕНТАРИИ И ОБСУЖДЕНИЯ
      бесплатное обучение для украинцев LIVE ONLINE FRONTEND DEVELOPER

      Пакеты подписки с доступом ко всем курсам и сервисам

      Стартовый
      • Все видеокурсы на 3 месяца
      • Тестирование по 10 курсам
      • Проверка 5 домашних заданий
      • Консультация с тренером 30 мин
      Базовый
      • Все видеокурсы на 6 месяцев
      • Тестирование по 16 курсам
      • Проверка 10 домашних заданий
      • Консультация с тренером 60 мин
      Премиум
      • Все видеокурсы на 12 месяцев
      • Тестирование по 24 курсам
      • Проверка 20 домашних заданий
      • Консультация с тренером 120 мин
      Notification success
      Мы используем cookie-файлы, чтобы сделать взаимодействие с нашими веб-сайтами и услугами простым и значимым.