如何手动封装 $ on off emit？

思路

$on(eventName,cb)

判断当前事件是否存在，如果存在则直接将函数push添加到数组中去

如果事件名称不存在，则创建一个数组 然后将函数添加到数组中去

$emit(eventName,[params])

判断当前事件是否存在 如果存在则拿到当前事件名称的数组，将其遍历调用，如需传递参数则在调用的时候

添加参数

$off(eventName,[cb])

判断当前事件是否存在，如果存在，则判断第二个参数是否存在

如果参数2不存在直接将数组清空

如果存在则找函数的下标，进行移除

 

let eventListener = {}


const $on = (eventName,cb)=>{
   if(!eventListener[eventName]){
      eventListener[eventName] = [];
   }

   eventListener[eventName].push(cb)
}


const $emit = (eventName,params)=>{
    if(eventListener[eventName]){
        eventListener[eventName].map((cb)=>{
            cb(params);
        })
    }
 }


 const $off = (eventName,cb)=>{
    if(eventListener[eventName]){
        if(cb){
            let index = eventListener[eventName].indexOf(cb);
            eventListener[eventName].splice(index,1);
        }else{
            eventListener[eventName].length = 0;
        }
    }
 }




 function fn1(val){
     console.log(111,val)
 }

 function fn2(val){
    console.log(222,val)
}

function fn3(val){
    console.log(333,val)
}


$on("handle",fn1)
$on("handle",fn2)
$on("handle",fn3)
$off("handle",fn1);
$emit("handle","懵逼了？");