Que es la forma más eficiente de manejar EventListeners?

votos
0

Escribí el siguiente código:

document.addEventListener('click', function (event) {
       if(event.target.matches('#open-new-not') || event.target.matches('#close-not')){
            opnNewNot();
       }
       if(event.target-matcheS('#hide-links')){
            hideLinks();
       }
       if(...and so on...){}
});

¿Es una buena solución? Podría, por favor aconsejar cómo podría manejar casi todos los procesadores de eventos de la manera más sencilla y eficiente? Muchas gracias.

Publicado el 07/11/2018 a las 22:30
fuente por usuario
En otros idiomas...                            


2 respuestas

votos
2

Si es absolutamente necesario seguir este camino, entonces le sugiero que utilice una switchdeclaración en oposición a una serie de ifs. Si lo hace, tiene la ventaja añadida de no interrumpir el manejo de otros eventos que usted no está tratando de interceptar.

document.addEventListener('click', function (event) {
    switch (event.target.id) {
        case 'open-new-not':
        case 'close-not':
            openNewNot();
            break;
        case 'hide-links':
            hideLinks();
            break;
        // etc
    }
});

Si tuviera que aunque me gustaría fuertemente considerar si o no quiero capturar cada clickcaso en cada elemento o si podría realista salirse con la orientación sólo un puñado de elementos selectos.

Respondida el 07/11/2018 a las 22:39
fuente por usuario

votos
1

Puesto que usted está emparejando sólo ID, no hay ningún punto en el uso de delegación de eventos (a menos que los elementos se cargan con pereza). Sólo tiene que instalar los detectores de eventos en los propios elementos, no utilice una gran cadena de if/ elseaquí. Delegación de eventos sólo hace que la gestión de eventos en muchos elementos similares más eficiente.

Respondida el 07/11/2018 a las 22:43
fuente por usuario

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more