在使用EventEmitter的時(shí)候我們常用的方法主要有on萎坷、emit脂崔、once、off, 下面我們簡(jiǎn)單實(shí)現(xiàn)一下這些方法
- 在實(shí)現(xiàn)這些方法之前爪飘，我們必須有一個(gè)構(gòu)造函數(shù)义起，并且需要導(dǎo)出去
function EventEmitter(){
//這里使用Object.create創(chuàng)建對(duì)象，有人會(huì)問為什么不直接 this._events = {};
//如果this._events = {} 這種方式上面是會(huì)存在__proto__ 而Object.create創(chuàng)建的是沒有的师崎，是一個(gè)比較干凈的對(duì)象
this._events = Object.create(null);
}
//導(dǎo)出
module.exports = EventEmitter;
- on方法的實(shí)現(xiàn)
EventEmitter.prototype.on = function(eventName,callback){
if(!this._events){ // 這里做判斷的原因是解決如果一個(gè)新的對(duì)象繼承了EventEmitter 但是沒有this._events 屬性
this._events = Object.create(null)
}
if(eventName !== 'newListener'){
if(this._events['newListener']){
this._events['newListener'].forEach(fn=>fn(eventName))
}
}
let arr = this._events[eventName] || (this._events[eventName] = []);
arr.push(callback);
}
- emit方法的實(shí)現(xiàn)
EventEmitter.prototype.emit = function(eventName,...args){
if(!this._events){
this._events = Object.create(null)
}
if(this._events[eventName]){
this._events[eventName].forEach(fn => {
fn(...args);
});
}
}
- once方法的實(shí)現(xiàn)
EventEmitter.prototype.once = function(eventName,callback){
const once = (...args)=>{
callback(...args);
this.off(eventName,once)
}
once.l = callback;
this.on(eventName,once)
}
- off方法的實(shí)現(xiàn)
EventEmitter.prototype.off = function(eventName,fn){
if(this._events[eventName]){
this._events[eventName] = this._events[eventName].filter(item=>{
//filter返回false就會(huì)被刪掉
return item !== fn && item.l !== fn;
})
}
}
