JS para impacientes

como usar o throttle no javascript es6

January 04, 2020

Creates a throttled function that only invokes the provided function at most once per every wait milliseconds

Use setTimeout() and clearTimeout() to throttle the given method, fn. Use Function.prototype.apply() to apply the this context to the function and provide the necessary arguments. Use Date.now() to keep track of the last time the throttled function was invoked. Omit the second argument, wait, to set the timeout at a default of 0 ms.

const throttle = (fn, wait) => {
  let inThrottle, lastFn, lastTime;
  return function() {
    const context = this,
      args = arguments;
    if (!inThrottle) {
      fn.apply(context, args);
      lastTime = Date.now();
      inThrottle = true;
    } else {
      lastFn = setTimeout(function() {
        if (Date.now() - lastTime >= wait) {
          fn.apply(context, args);
          lastTime = Date.now();
      }, Math.max(wait - (Date.now() - lastTime), 0));
  throttle(function(evt) {
  }, 250)
); // Will log the window dimensions at most every 250ms

Acesse a Referência original

Está curtindo os conteúdos da Reativa? Quer que a gente te ajude a ser um dev melhor? Clique aqui.