简体   繁体   中英

What are the differences between EventEmitter, EventTarget and EventDispatcher

I'm trying to learn implementations of Observer Pattern.

EventEmitter/EventTarget/EventDispatcher are one implementation of Observer Pattern but I wonder the differences between these three.

Any help would be appreciated?

You can easily find documentation about all of them I think:

  • EventTarget - quite simple implementation to use in browsers
  • EventEmitter - native nodejs implemetation, rich on functionality
  • EventDispatcher - one of many implementations, used mostly in PHP

I would like to mention a detail difference when adding the same listener.

EventEmitter:

const EventEmitter = require('node:events')

const foo = new EventEmitter()
foo.on('event', listener)
foo.on('event', listener)
foo.emit('event')
// called: 1
// called: 2

function listener() {
  console.count('called')
}

EventTarget:

const foo = new EventTarget()
foo.addEventListener('event', listener)
foo.addEventListener('event', listener)
foo.dispatchEvent(new Event('event'))
// called: 1

function listener() {
  console.count('called')
}

// ------

const foo = new EventTarget()
foo.addEventListener('event', listener, { once: true })
foo.addEventListener('event', listener)
foo.dispatchEvent(new Event('event'))
foo.dispatchEvent(new Event('event'))
// called: 1

function listener() {
  console.count('called')
}

// -----

const foo = new EventTarget()
foo.addEventListener('event', listener)
foo.addEventListener('event', listener, { once: true })
foo.dispatchEvent(new Event('event'))
foo.dispatchEvent(new Event('event'))
// called: 1
// called: 2

function listener() {
  console.count('called')
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM