regresar a la lección

¿Qué handlers se ejecutan?

importancia: 5

Hay un botón en la variable. No hay handlers en él.

¿Qué handlers se ejecutan con el click después del siguiente código? ¿Qué alertas se muestran?

button.addEventListener("click", () => alert("1"));

button.removeEventListener("click", () => alert("1"));

button.onclick = () => alert(2);

La respuesta: 1 y 2.

El primer handler se activa porque no es removido por removeEventListener. Para remover el handler necesitamos pasar exactamente la función que fue asignada. Y en el código se pasa una función que luce igual pero es otra función.

Para remover un objeto de función necesitamos almacenar una referencia a él, así:

function handler() {
  alert(1);
}

button.addEventListener("click", handler);
button.removeEventListener("click", handler);

El handler button.onclick funciona independientemente y en adición a addEventListener.