事件总线-(EventBus)

 1 class EventBus{
 2     constructor(){
 3         this.eventBus={}
 4     }
 5     on(eventName,eventCallback,thisArg){
 6         let handlers=this.eventBus[eventName]
 7         if(!handlers){
 8             handlers=[]
 9             this.eventBus[eventName]=handlers
10         }
11         handlers.push({
12             eventCallback,
13             thisArg
14         })
15     }
16     off(eventName,eventCallback){
17         const handlers=this.eventBus[eventName]
18         if(!handlers)return
19         const newHandlers=[...handlers]
20         for(let i=0;i<newHandlers.length;i++){
21             const handler=newHandlers[i]
22             if(handler.eventCallback===eventCallback){
23                 const index=handlers.indexOf(handler)
24                 handlers.splice(index,1)
25             }
26         }
27     }
28     emit(eventName,...payload){
29         const handlers=this.eventBus[eventName]
30         if(!handlers)return
31         handlers.forEach(handler => {
32             handler.eventCallback.apply(handler.thisArg,payload)
33         });
34     }
35 }
36 const eventBus=new EventBus()
37 
38 //main.js
39 eventBus.on('abc',function(){
40     console.log('watch abc1',this)
41 },{name:'koo'})
42 const handleCallback=function(){
43     console.log('watch abc2',this)
44 }
45 eventBus.on('abc',handleCallback,{name:'koo'})
46 
47 //utils.js
48 eventBus.emit('abc',123)
49 
50 //移除监听
51 eventBus.off('abc',handleCallback)
52 eventBus.emit('abc',123)