Не могу понять, что происходит с EventEmitter с использованием модулей webpack и es6

Я пытаюсь изучить webpack и es6 одновременно и осознал необходимость какой-то шины событий. Я новичок в EventEmitters и конструкторов. Я прочитал документы и множество примеров, но, честно говоря, я не понимаю, почему приведенный ниже код ведет себя так, как он. Есть только один экземпляр эмиттера, так почему же счетчик или removeListener не могут найти ничего? Если у меня есть весь код в одном файле, он работает нормально.

entry.js

import dVpEe from '../modules/eventEmitter';
const temp = new dVpEe();


var abc = function abc() {
    console.log('funciton a');
};

var b = function() {
    console.log('funciton b');
};

temp.evesdroppers('connection');
temp.hear('connection', abc);
temp.evesdroppers('connection');
temp.say('connection');
temp.hear('connection', b);
temp.evesdroppers('connection');
temp.say('connection');
temp.walk('connection', abc);
temp.say('connection');

eventEmitter.js

import events from 'events';
import util from 'util';

var EventEmitter = events.EventEmitter;

var dVpEe = function() {
    EventEmitter.call(this);
};

util.inherits(dVpEe, EventEmitter);

dVpEe.prototype.walk = function(event, cb, name) {
    console.log('%c' + (name || 'creeper') + '%c NOT listening for %c' + event, 'color: pink', 'color: white', 'color: pink');
    this.removeListener(event, cb);
};

dVpEe.prototype.say = function(event, name) {
    console.log('%c' + (name || 'someone') + '%c screamed %c' + event, 'color: pink', 'color: white', 'color: pink');
    this.emit(name);
};

dVpEe.prototype.evesdroppers = function(event) {
    var eventListeners = events.EventEmitter.listenerCount(this, event);
    console.log('%c' + eventListeners + '%c listner(s) for %c' + event, 'color: pink', 'color: white', 'color: pink');
};

dVpEe.prototype.hear = function(event, cb, name) {
    console.log('%c' + (name || 'creeper') + '%c listening for %c' + event, 'color: pink', 'color: white', 'color: pink');
    this.addListener(name, cb);
};

export default dVpEe;

Ouput

0 listner(s) for connection
creeper listening for connection
0 listner(s) for connection
someone screamed connection
function a
creeper listening for connection
0 listner(s) for connection
someone screamed connection
function a
funciton b
creeper NOT listening for connection
someone screamed connection
funciton a
funciton b

1 ответ

Решение

Это просто опечатка в dVpEe.prototype.hear,

dVpEe.prototype.hear = function(event, cb, name) {
    console.log((name || 'creeper') + ' listening for "' + event + "'");
    this.addListener(name, cb); // ouch!
};

Я бы также предложил заменить устаревшую EventEmitter.listenerCount в emitter.listenerCount:

dVpEe.prototype.evesdroppers = function(event) {
    var eventListeners = this.listenerCount(event);
};

Поскольку вы используете ES6, я предлагаю использовать рычаги class синтаксис, который гораздо более читабелен:

import { EventEmitter } from 'events';

export default class extends EventEmitter {
  walk(event, cb, name) {
      console.log((name || 'creeper') + ' NOT listening for "' + event + "'");
      this.removeListener(event, cb);
  }

  // and so on
};
Другие вопросы по тегам