JavaScript中有五种异步编程的体式格局
- 1.回调函数
2.事宜监听
3.宣布定阅
4.Promise对象
5.Generator函数
宣布/定阅 形式
比方说淘宝购物,小红在淘宝上看到一双鞋,然则卖光了,小红联络卖家什么时刻有货,卖家关照小红需要等一星期,卖家说假如喜好能够等有货的时刻
再关照你,所以小红珍藏了该商号,然则同时,小明,小花也喜好这款鞋,也珍藏了改商号,等鞋子到了就会顺次关照小红,小明,小花。
这里卖家属于宣布者,小红,小明属于定阅者
function Public(){
this.handles = {}
//定阅事宜
this.addEventListener = function(eventType,fn){
if(!(eventType in this.handles)){
this.handles[eventType] = []
}
this.handles[eventType].push(fn)
console.log(this.handles)
return this;
},
// 触发事宜
this.dispatchEvent = function(eventType){
var handlerArgs = Array.prototype.slice.call(arguments,1);
if(!this.handles[eventType]){
throw Error("该称号未宣布")
}
for(var i=0;i<this.handles[eventType].length;i++){
this.handles[eventType][i].apply(this,handlerArgs)
}
return this;
}
// 删除定阅事宜
this.removeEventListener = function(eventType,handler){
var currentEvent = this.handles[eventType];
if(!handler){
delete(this.handles[eventType])
return
}
if (currentEvent) {
const index = this.handles[eventType].findIndex(ele => ele.name === handler.name)
this.handles[eventType].splice(index,1)
}
return this;
}
}
var publish = new Public();
publish.addEventListener("xiaohong",function tellHong(data){
console.log(`${data}`)
})
publish.addEventListener("xiaoming",function tellMing(data){
console.log(`${data}`)
})
publish.dispatchEvent("xiaohong","小红你的鞋子到了")
publish.dispatchEvent("xiaoming","小明你的鞋子到了")
publish.removeEventListener("xiaohong")