/*
* 示例:
* Event.create("namespace1").listen('click', function(a){
* console.log(a);
* });
* Event.create("namespace1").trigger("click", 1);
*/
window.myEvent = (function() {
var global = this,
Event,
_default = 'default'; Event = function() {
var _listen,
_trigger,
_remove,
_slice = Array.prototype.slice,
_shift = Array.prototype.shift,
_unshift = Array.prototype.unshift,
namespaceCache = [],
_create,
find,
each = function( ary, fn) {
var ret;
for(var i = 0, l = ary.length; i < l; i++) {
var n = ary[i];
ret = fn.call(n, i, n);
}
return ret;
};
// 订阅
_listen = function(key, fn, cache) {
if(!cache[key]) {
cache[key] = [];
}
cache[key].push(fn);
};
// 移除订阅
_remove = function(key, cache, fn) {
if(cache[key]) {
if(fn) {
for(var i = cache[key].length; i >=0; i++) {
if(cache[key][i] === fn) {
cache[key].splice(i, 1);
}
}
}else {
cache[key] = [];
}
}
};
// 发布
_trigger = function() {
var cache = _shift.call(arguments),
key = _shift.call(arguments),
args = arguments,
_self = this,
ret,
stack = cache[key];
if(!stack || !stack.length) {
return;
}
return each(stack, function() {
return this.apply(_self, args);
});
};
// 创建命名空间
_create = function(namespace) {
var namespace = namespace || _default;
var cache = {},
offlineStack = [], // 离线事件
ret = {
listen: function (key, fn, last) {
_listen(key, fn, cache);
if (offlineStack == null) {
return;
}
if (last === 'last') {
offlineStack.length && offlineStack.pop()();
} else {
each(offlineStack, function () {
this();
});
}
offlineStack = null;
}, one: function (key, fn, last) {
_remove(key, cache);
this.listen(key, fn, last);
}, remove: function(key, fn, last) {
_remove(key, cache, fn);
}, trigger: function() {
var fn,
args,
_self = this;
_unshift.call(arguments, cache);
args = arguments;
fn = function() {
return _trigger.apply(_self, args);
};
if(offlineStack) {
return offlineStack.push(fn);
}
return fn();
}
}; return namespace ? (namespaceCache[namespace] ? namespaceCache[namespace] : namespaceCache[namespace] = ret) : ret;
}; return {
create: _create,
one: function(key, fn, last) {
var event = this.create();
event.one(key, fn, last);
},
remove: function(key, fn) {
var event = this.create();
event.remove(key, fn);
},
listen: function(key, fn, last) {
var event = this.create();
event.listen(key, fn, last);
},
trigger: function() {
var event = this.create();
event.trigger.apply(this, arguments);
}
};
}();
return Event;
})();

js 自定义事件观察者模式(发布/订阅)的更多相关文章

  1. Jquery 自定义事件实现发布/订阅

    //用户点击logoff按钮时,广播一个自定义事件,给任何需要保存状态的感兴趣的观察者,然后导航到logoff页面 $('#logoff').click(function(){ $.event.tri ...

  2. javaScript 自定义事件、发布订阅设计模式

    现在很多应用都允许用户根据自己的喜好订阅一些自己较为关注的信息,当应用更新了这些信息后将针对不同的订阅类型推送此类信息.例如xx招聘网,当你订阅了互联网IT技术相关分类的招聘信息推送后,当企业在该网站 ...

  3. js自定义事件、DOM/伪DOM自定义事件

    一.说明.引言 我JS还是比较薄弱的,本文的内容属于边学边想边折腾的碎碎念,可能没什么条理,可能有表述不准确的地方,可能内容比较拗口生僻.如果您时间紧迫,或者JS造诣已深,至此您就可以点击右侧广告(木 ...

  4. 漫谈js自定义事件、DOM/伪DOM自定义事件

    一.说明.引言 我JS还是比较薄弱的,本文的内容属于边学边想边折腾的碎碎念,可能没什么条理,可能有表述不准确的地方,可能内容比较拗口生僻.如果您时间紧迫,或者JS造诣已深,至此您就可以点击右侧广告(木 ...

  5. js 自定义事件 包含 添加、激活、销毁

    1.思路 (1)构思 var eventTarget = { addEvent: function(){ //添加事件 }, fireEvent: function(){ //触发事件 }, remo ...

  6. C# 委托和事件 与 观察者模式(发布-订阅模式)讲解 by天命

    使用面向对象的思想 用c#控制台代码模拟猫抓老鼠 我们先来分析一下猫抓老鼠的过程 1.猫叫了 2.所有老鼠听到叫声,知道是哪只猫来了 3.老鼠们逃跑,边逃边喊:"xx猫来了,快跑啊!我是老鼠 ...

  7. SpringBoot事件监听机制及观察者模式/发布订阅模式

    目录 本篇要点 什么是观察者模式? 发布订阅模式是什么? Spring事件监听机制概述 SpringBoot事件监听 定义注册事件 注解方式 @EventListener定义监听器 实现Applica ...

  8. JS中什么是发布--订阅模式?

    转载文章部分内容: 发布订阅模式介绍 发布---订阅模式又叫观察者模式,它定义了对象间的一种一对多的关系,让多个观察者对象同时监听某一个主题对象,当一个对象发生改变时,所有依赖于它的对象都将得到通知. ...

  9. js自定义事件

    自定义事件的本质,创建一个对象,然后把事件的名字作为对象的一个属性,然后value是一个[],把此事件的所以回调都push进去. 写一个很基本的,没有把对象暴露出去的js的自定义事件. var eve ...

随机推荐

  1. c# 项目文件,C#viual studio使用方法

    一.项目文件 1)Properties节点下主要存放的是当前程序集相关的信息,如版本号.标题等.双击”Properties“,打开如下项目属性窗口,可以设置项目相关的一些参数. 2)引用 节点主要列出 ...

  2. 第十课——cluster故障转移操作,codis部署

    作业描述] 1.cluster的故障转移操作,截图展示 2.部署codis,并写代码访问codis ================================================== ...

  3. Servlet------>jsp jstl核心标签库

    这里不需要刻意记,在jar里,c.tld文件都有,可以自己找源码看

  4. 七牛云存储--内存put示例(go sdk)

    啥都不说了,居然有文档,有git为啥不提供example? 自己看代码,琢磨了一下,原来是要这么用的.这里不得不吐槽一下package的命名,为啥要去io?golang自带系统包名就有io啊,哥哥. ...

  5. 从HD OJ 1005想到的

    杭电OJ [1005](http://acm.hdu.edu.cn/showproblem.php?pid=1005): #####Problem Description > A number ...

  6. 发现一个小技巧:火狐浏览器对phpmyadmin支持更友好

    这段时间ytkah正在迁移服务器(A→B),为了方便起见,直接用phpmyadmin导入数据库.一般我们是用navicat来操作数据库的,但是服务器A设置了权限,无法用navicat连接,只好在浏览器 ...

  7. Oracle扩容表空间

    1.程序报错,无法进行修改操作,通过日志,看到如下错误 2.通过google查询,问题是表空间文件不够了 "表空间大小(M)",(a.bytes "已使用空间(M)&qu ...

  8. HALCON里面的一维测量。

    第一步:将图片导入, 拿到图片的名字 和窗口的句柄 第二步:创建一个测量区域.这个测量区域是一个矩形,假设他的名字叫A gen_measure_rectangle2 (TmpCtrl_Row,//输入 ...

  9. 无线路由MAC地址过滤安全可靠性讨论

    无线路由MAC地址过滤安全可靠性讨论/如何实现,真的有效吗,如何防范       [内容导航] 什么是MAC地址过滤 突破MAC地址过滤步骤 捕获的无线客户端MAC地址 更改MAC地址来伪造身份 在W ...

  10. centos7使用中文输入法

    centos7自带中文输入法,可能我们在安装时会跳过选择汉语拼音,我们来重新设置一下吧 假如你在命令行界面,输入Ctrl+Alt+F1进入图形界面 点击左上角系统工具   --> 设置 --&g ...