@nonoll/code-snippet Class: EventEmitter

new EventEmitter()

EventEmitter 의 기능과 동일한 맥락으로, 간단히 구성

Source:

event/EventEmitter.ts, line 5

See:

https://www.npmjs.com/package/events

Example

import { EventEmitter } from '@nonoll/code-snippet/event';

const createElement = ({ tag = 'div', id = '', style = '', value = '', text = '' }) => {
  const doc = window.document;
  const target = doc.createElement(tag);
  target.setAttribute('id', id);
  target.setAttribute('style', style);
  target.setAttribute('value', value);
  if (text) {
    target.textContent = text;
  }
  return target;
}

let ee;
const forExample = () => {
  const doc = window.document;

  const onButton = createElement({ tag: 'button', text: 'on button' });
  const offButton = createElement({ tag: 'button', text: 'off button' });
  const emitButton = createElement({ tag: 'button', text: 'emit button' });
  const EVENT_NAME = 'EVENT_EXAMPLE';

  doc.body.appendChild(onButton);
  doc.body.appendChild(offButton);
  doc.body.appendChild(emitButton);

  ee = new EventEmitter();
  ee.on(EVENT_NAME, res => console.log(res));

  onButton.addEventListener('click', e => {
    e.preventDefault();
    console.log('onButton clicked');
    if (!ee) {
      return;
    }
    ee.off(EVENT_NAME);
    ee.on(EVENT_NAME, res => console.log(res));
  });

  offButton.addEventListener('click', e => {
    e.preventDefault();
    console.log('offButton clicked');
    if (!ee) {
      return;
    }
    ee.off(EVENT_NAME);
  });

  emitButton.addEventListener('click', e => {
    e.preventDefault();
    console.log('emitButton clicked');
    if (!ee) {
      return;
    }
    ee.emit(EVENT_NAME, new Date());
  });
}

forExample();