Tengo una función asincrónica base que devuelve una Promesa
function asyncFoo(): Promise<void> { return new Promise<void>((resolve, reject) => { // I'm using here a setTimeout to fake async flow, in reality I'm making a server call setTimeout(() => { resolve(); }, 5000); }); }Puedo usar mi método
const promise = asyncFoo(); promise.then(() => { console.log('Hello'); }); Sin embargo, si debounce mi función, la función de resultado no devuelve nada y no puedo esperar a que se resuelva.
const debounceFoo = _.debounce(asyncFoo, 100); debounceFoo(); // undefined // I would like to do something like // debounceFoo().then(...) this will not work ¿Cómo puedo eliminar los eventos (agregarlos) que ocurren durante el tiempo de eliminación y luego ejecutar mi asyncFoo() . Y finalmente, ¿actuar en su devolución de llamada de resolución?
Puedes usar la promesa para hacer esto:
const debounceAsync = (func, wait) => { let timerID = -1; return (...args) => { clearTimeout(timerID); const promiseForFunc = new Promise((resolve) => { timerID = setTimeout(resolve, wait); }); return promiseForFunc.then(() => func(...args)); }; }; const debounceFoo = debounceAsync(asyncFoo, 100); debounceFoo().then(() => { console.log('Hello'); }); La función de rebote que regresa por lodash debounce generalmente regresa undefined antes de la primera vez que se invocó su función.
https://github.com/lodash/lodash/blob/2f79053d7bc7c9c9561a30dda202b3dcd2b72b90/debounce.js#L184-L206
No estoy seguro acerca de la implementación de lodash, pero puede escribir su propio rebote como este.
function debounce(func, timeout) { let timer; return (...args) => { clearTimeout(timer); timer = setTimeout(() => { func.apply(this, args); }, timeout); }; } function asyncBar() { return new Promise((resolve) => { setTimeout(() => { console.log("Hi"); resolve(); }, 4000); }); } const foo = debounce(async () => asyncBar(), 5000); foo();