javascript - polyfill - jquery custom events

Evento vs CustomEvent

Question

Me preguntaba cuál es el propósito de CustomEvent , ya que puede ser fácilmente imitado por un buen Event antiguo.

Entonces, ¿cuál es la diferencia entre:

var e = new Event("reload");
e.detail = {
    username: "name"
};
element.dispatchEvent(e);

y

var e = new CustomEvent("reload", {
    detail: {
        username: "name"
    }
});
inner.dispatchEvent(e);

¿Por CustomEvent existe CustomEvent si es fácil adjuntar datos personalizados a un objeto de evento normal?

Answer 1

No es lo mismo. No puedes establecer el detail de un CustomEvent real:

var event = new CustomEvent(''myevent'', {detail:123});
event.detail = 456; // Ignored in sloppy mode, throws in strict mode
console.log(event.detail); // 123

var event = new Event(''myevent'');
event.detail = 123; // It''s not readonly
event.detail = 456;
console.log(event.detail); // 456

Sí, puedes usar Object.defineProperty . Pero supongo que el punto es que el argumento de CustomEvent se suponía que debía establecer algunos datos internos del evento. Ahora solo considera el detail , que no se usa internamente. Pero una especificación futura podría agregar algo nuevo, y entonces es posible que no pueda configurar los datos internos mediante el uso de propiedades.

Un CustomEvent también se hereda de CustomElement.prototype . Eso solo agrega detail y el obsoleto initCustomEvent . Pero puedes agregar tus propios métodos o propiedades allí, que no serán heredados por otros eventos. Pero no recomiendo esto, no deberías modificar los objetos que no tienes.

Básicamente, puedes usar CustomEvent para clasificar el evento de manera diferente a otros eventos. Ver este gráfico de una vieja especificación.