Estoy tratando de escribir una función de "rebote" y estoy atascado en un segmento del código. En el siguiente código, paso una devolución de llamada a addEventListener y la debounce en una función de rebote.
Esta función tendrá más funciones más adelante, pero por ahora, solo quiero que devuelva una función, que establecerá un tiempo de espera para delay milisegundos y luego llamará a la función original con el argumento (en este caso, e ).
Mi problema está en la línea en la función de debounce que dice callback("original-args") . Me gustaría reemplazar "argumentos originales" con el argumento real que se pasó a la devolución de llamada. ¿Cómo obtengo acceso a ese argumento?
button.addEventListener("click", debounce(e => { let elem = document.createElement("P"); elem.textContent = "Clicked"; container.appendChild(elem); }, 2000)) function debounce(callback, delay) { return function() { setTimeout(() => { callback("original-args") }, delay) } }Puedes hacer algo como lo siguiente:
button.addEventListener( "click", debounce( (e) => { let elem = document.createElement("P"); elem.textContent = "Clicked"; container.appendChild(elem); }, 2000 ) ); function debounce(callback, delay) { return function (...args) { setTimeout(() => { callback(...args); }, delay); }; } De modo que puede pasar los ...args argumentos a su función antirrebote. El ...args es un operador de extensión que significa take any number of arguments and store them inside the variable args .