Digamos que tienes simple:
document.removeEventListener('click', clickHandler); ¿ removeEventListener elimina un oyente registrado para eventos de click llamado clickHandler o elimina un oyente registrado para eventos de click que hacen referencia a la misma función a la que hace referencia clickHandler ?
Aquí dicen:
El detector de eventos que se eliminará se identifica mediante una combinación del tipo de evento, la propia función del detector de eventos y varias opciones opcionales que pueden afectar el proceso de coincidencia.
Cuando dicen " la función de escucha de eventos en sí misma ", ¿se refieren a la misma referencia?
Lo pregunto porque tengo (en un proyecto React) una función memorizada que elimina un montón de detectores de eventos y me gustaría saber con qué frecuencia necesito obtener una nueva función.
Si removeEventListener elimina los controladores por nombres, puedo dejar vacía la matriz de dependencias de useCallback .
Pero si removeEventListener elimina por referencias, necesito poner todos los oyentes en la matriz de dependencia. Y tal vez estaría mejor sin memorización.
En su ejemplo, clickHandler es un identificador . Los identificadores no se pueden convertir en cadenas, por lo que JavaScript no puede recordar si el mismo nombre de identificador se ha utilizado como argumento anteriormente. Son simplemente nombres destinados a ser leídos por los desarrolladores.
Entonces sí, deberá pasar la referencia a la función. Incluso si pasa esa referencia a través de otro identificador.
function clickHandler() { console.log('Clicked!'); } const buttonElement = document.querySelector('button'); buttonElement.addEventListener('click', clickHandler); setTimeout(() => { const differentHandlerName = clickHandler; buttonElement.removeEventListener('click', differentHandlerName); console.log('Removed event listener via a different identifier name'); }, 2000); <button> Click </button>Debe pasar una referencia a la misma función utilizada para addEventListener al llamar a removeEventListener