您的位置：首页 > Web前端 > JavaScript

js 发布/订阅模式

2018-02-04 22:13 363 查看

直接上代码

js代码test.js

var xEvent=(function(){
function xEvent(){
this._events={};
}
xEvent.prototype={
emit:function(name,obj){
if(name in this._events){
for(var i=0;i<this._events[name].length;i++){
this._events[name][i](obj);
}
}
},
on:function(name,callback){
if(!(name in this._events)){
this._events[name]=[];
}
this._events[name].push(callback);
},
remove:function(name,callback){
this._events[name]?this._events[name].splice(this._events[name].indexOf(callback), 1) : void 0;
},
removeAll:function(name){
this._events[name]=[]
}
}
return xEvent;
})();

测试代码test.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>js发布/订阅模式</title>
</head>
<body>
<script src="./test.js">
</script>
<script>
var event=new xEvent();
var test0=function(res){
console.info('test0-----监听',res);
};

var test1=function(res){
console.info('test1-----监听',res);
};

console.info('test0--------------------------start');
event.on('test0',test0);

event.emit('test0',{
code:0,
msg:'test0---0',
data:null
});

console.info('test1-------------------移除监听测试');
event.on('test1',test1);
event.remove('test1');
event.emit('test1',{
code:1,
msg:'test1---1',
data:null
});
</script>
</body>
</html>

测试结果

test0--------------------------start
test.html:15 test0-----监听 {code: 0, msg: "test0---0", data: null}
test.html:31 test1-------------------移除监听测试

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航