Вот несколько функций декораторов, которые вы можете написать с нуля

Автор оригинала: FreeCodeCamp Community Member.

Откройте для себя функциональный JavaScript был назван одним из Лучшие новые функциональные программирования книги BookAuthority !

Давайте напишем некоторые общие функции декораторы, найденные в библиотеках, таких как underscore.js , lodash.js или Ramda.js Отказ

однажды()

один раз (Fn) : Создает версию функции, которая выполняется только один раз. Это полезно для функции инициализации, где мы хотим убедиться, что она работает только один раз, независимо от того, сколько раз его называют из разных мест.

function once(fn){
  let returnValue;
  let canRun = true;
  return function runOnce(){
      if(canRun) {
          returnValue = fn.apply(this, arguments);
          canRun = false;
      }
      return returnValue;
  }
}

var processonce = once(process);
processonce(); //process
processonce(); //

один раз () это функция, которая возвращает другую функцию. Возвращенная функция Runonce () это закрытие Отказ Также важно отметить, как называется оригинальная функция – пройдя в текущее значение это И все Аргументы : fn.apply (это, аргументы) Отказ

после()

После (счет, FN) : Создает версию функции, которая выполняется только после нескольких вызовов. Это полезно, например, когда мы хотим убедиться, что функция работает только после завершения всех асинхронных задач.

function after(count, fn){
   let runCount = 0;
   return function runAfter(){
      runCount = runCount + 1;
      if (runCount >= count) {
         return fn.apply(this, arguments);        
      }
   }
}

function logResult() { console.log("calls have finished"); }

let logResultAfter2Calls = after(2, logResult);
setTimeout(function logFirstCall() { 
      console.log("1st call has finished"); 
      logResultAfter2Calls(); 
}, 3000);

setTimeout(function logSecondCall() { 
      console.log("2nd call has finished"); 
      logResultAfter2Calls(); 
}, 4000);

Обратите внимание, как я использую после () построить новую функцию logresultafter2Calls () это будет выполнять оригинальный код logresult () только после второго вызова.

дроссель ()

дроссель (FN, ждать) : Создает версию функции, которая, когда его неоднократно вызывают, позвонит оригинальную функцию один раз за каждый Подожди Миллисекунды. Это полезно для ограничения событий, которые происходят быстрее.

function throttle(fn, interval) {
    let lastTime;
    return function throttled() {
        let timeSinceLastExecution = Date.now() - lastTime;
        if(!lastTime || (timeSinceLastExecution >= interval)) {
            fn.apply(this, arguments);
            lastTime = Date.now();
        }
    };
}

let throttledProcess = throttle(process, 1000);
$(window).mousemove(throttledProcess);

В этом примере перемещение мыши будет генерировать много MouseMove События, но призыв оригинальной функции Процесс () просто произойдет один раз в секунду.

Для получения дополнительной информации о применении методов функциональных программиров в реакции посмотрите на Функциональный реагировать Отказ

Учить Функциональный реагировать в проекте, основанном на проекте, с Функциональная архитектура с реагированием и redux Отказ

однажды()

после()

дроссель ()

Читайте ещё по теме: