最近做React项目的时候使用了events库中的EventEmit,动手实现了一个简易版,了解到EventEmit本质上是观察者模式的一种实现。
export default class EventEmitter {
constructor() {
this.event = {};
this.maxListerners = 10;
}
// 监听
on(type, listener) {
if (this.event[type]) {
if (this.event[type].length >= this.maxListerners) {
console.error('同一个监听器最多被十个对象监听,否则可能造成内存泄漏.\n');
return;
}
this.event[type].push(listener);
} else {
this.event[type] = [listener];
}
}
//发送监听
emit(type, ...rest) {
if (this.event[type]) {
this.event[type].map(fn => fn.apply(this, rest));
}
}
//移除监听器
removeListener(type) {
if (this.event[type]) {
delete this.event[type];
console.log(this.event);
}
}
//移除所有的监听器
removeAllListener() {
this.event = {};
}
}
调用:
import EventEmit from './EventEmit';
let DeviceEventEmit = new EventEmit();
DeviceEventEmit.on('event', (param1, param2) => {
console.log('DeviceEventEmit', param1, param2);
});
DeviceEventEmit.emit('event', 'param1', 'param2');
DeviceEventEmit.removeListener('event');
运行结果: