Как я могу использовать регулирование для получения цели события? - PullRequest
0 голосов
/ 11 января 2019

Ссылаясь на этот сайт, https://codeburst.io/throttling-and-debouncing-in-javascript-646d076d0a44

throttled(delay, fn) {
    let lastCall = 0;
    return function (...args) {
        const now = (new Date).getTime();
        if (now - lastCall < delay) {
            return;
        }
        lastCall = now;
        return fn(...args);
    }
}


Я хочу использовать функцию удушения, как это.

item.addEventListener('click', throttled(2000, func(e.target)));


Я должен использовать это, чтобы получить значение e.target.
Однако, если вы напишите этот код, функция регулирования не будет работать должным образом.

item.addEventListener('click', (e) => {throttled(2000, func(e.target))});


Как я могу заставить функцию удушения работать должным образом при получении целевых событий кликов?

Ответы [ 2 ]

0 голосов
/ 11 января 2019

Ваша дросселированная функция ожидает функцию в качестве второго параметра.

давайте предположим, что func просто регистрирует e.target на консоли, вы можете написать:

item.addEventListener('click', throttled(2000, func));

с

const func = (e) => console.log(e.target);

Или, если вы хотите, чтобы все было в одной строке:

item.addEventListener('click', throttled(2000, (e) => func(e.target)));
0 голосов
/ 11 января 2019

Ваша throttled функция вернет функцию-обертку вокруг вашего исходного обработчика событий. Он передаст все аргументы, полученные при now - lastCall >= delay, в функцию обратного вызова fn.
Это та функция-обертка, которую вы добавите в качестве обработчика событий, т.е. возвращаемое значение throttled().

Таким образом, все, что вам нужно передать throttled, - это обычный обработчик событий, то есть то же самое, что вы передали бы слушателю событий:

// let's be a bit verbose

// our event handler
function handleevent(evt) {
  console.log(evt.clientX); // logging the clientX here because evt.target is a big object for SO's console.
}
// the wrapper function
const myThrottledFunc = throttled(2000, handleevent);
// we add the wrapper as event handler
addEventListener('click', myThrottledFunc);


function throttled(delay, fn) {
  let lastCall = 0;
  return function wrapper(...args) {
    const now = (new Date).getTime();
    if (now - lastCall < delay) {
      return;
    }
    lastCall = now;
    return fn(...args);
  }
}
click anywhere

или как однострочный onclick = throttled(2000, evt => console.log(evt.target));

...