现在很多应用都允许用户根据自己的喜好订阅一些自己较为关注的信息,当应用更新了这些信息后将针对不同的订阅类型推送此类信息。例如xx招聘网,当你订阅了互联网IT技术相关分类的招聘信息推送后,当企业在该网站发布互联网IT技术相关的招聘信息后,你就能收到该招聘网的推送信息,就可以很轻松的得到你感兴趣的信息,而不会被其他一些乱七八糟的信息浪费时间。

在这里涉及了三个不同类的事物,1,你(消息订阅者);2,企业(消息发布者);3,招聘网(中介,联系发布者与订阅者的桥梁);

定义消息发布平台

function EventTarget() {
this.handlers = {};
} EventTarget.prototype = {
constructor : EventTarget, //订阅消息
addHandler : function(type, handler) {
if (typeof this.handlers[type] == "undefined") {
this.handlers[type] = [];
} this.handlers[type].push(handler);
}, //发布消息
fire : function(event) {
if (!event.target) {
event.target = this;
}
if (this.handlers[event.type] instanceof Array) {
var handlers = this.handlers[event.type];
for (var i = 0, len = handlers.length; i < len; i++) {
handlers[i](event);
}
}
}, //取消订阅
removeHandler : function(type, handler) {
if (this.handlers[type] instanceof Array) {
var handlers = this.handlers[type];
for (var i = 0, len = handlers.length; i < len; i++) {
if (handlers[i] === handler) {
break;
}
} handlers.splice(i, 1);
}
}
};

订阅与发布

    var btn1 = document.getElementById("test1");
var etarget = new EventTarget(); function handler1(event){
alert("handler1:" + JSON.stringify(event));
}; function handler2(event){
alert("handler2:" + JSON.stringify(event));
}; //订阅
etarget.addHandler("msgType", handler1);
etarget.addHandler("msgType", handler2); //点击按钮触发发布消息(触发事件)
btn1.addEventListener("click", function(){
var event = {};
event.type = "msgType";
event.msg = "this is a custom event's message ."
etarget.fire(event);
}, false);

javaScript 自定义事件、发布订阅设计模式的更多相关文章

  1. javascript 自定义事件 发布-订阅 模式 Event

    * javascript自定义事件 var myEvent = document.createEvent("Event"); myEvent.initEvent("myE ...

  2. 模块(类)之间解耦利器:EventPublishSubscribeUtils 事件发布订阅工具类

    如果熟悉C#语言的小伙伴们一般都会知道委托.事件的好处,只需在某个类中提前定义好公开的委托或事件(委托的特殊表现形式)变量,然后在其它类中就可以很随意的订阅该委托或事件,当委托或事件被触发执行时,会自 ...

  3. Javascript事件模型系列(四)我所理解的javascript自定义事件

    被我拖延了将近一个月的javascript事件模型系列终于迎来了第四篇,也是我计划中的最后一篇,说来太惭愧了,本来计划一到两个星期写完的,谁知中间遇到了很多事情,公司的个人的,搞的自己心烦意乱浮躁了一 ...

  4. 理解的javascript自定义事件

    理解的javascript自定义事件 被我拖延了将近一个月的javascript事件模型系列终于迎来了第四篇,也是我计划中的最后一篇,说来太惭愧了,本来计划一到两个星期写完的,谁知中间遇到了很多事情, ...

  5. javascript中的发布订阅模式与观察者模式

    这里了解一下JavaScript中的发布订阅模式和观察者模式,观察者模式是24种基础设计模式之一. 设计模式的背景 设计模式并非是软件开发的专业术语,实际上设计模式最早诞生于建筑学. 设计模式的定义是 ...

  6. JavaScript实现的发布/订阅(Pub/Sub)模式

    JavaScript实现的发布/订阅(Pub/Sub)模式 时间 2016-05-02 18:47:58  GiantMing's blog 原文  http://giantming.net/java ...

  7. Javascript中理解发布--订阅模式

    Javascript中理解发布--订阅模式 阅读目录 发布订阅模式介绍 如何实现发布--订阅模式? 发布---订阅模式的代码封装 如何取消订阅事件? 全局--发布订阅对象代码封装 理解模块间通信 回到 ...

  8. [转] Javascript中理解发布--订阅模式

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

  9. 【转】Javascript中理解发布--订阅模式

    Javascript中理解发布--订阅模式 阅读目录 发布订阅模式介绍 发布---订阅模式又叫观察者模式,它定义了对象间的一种一对多的关系,让多个观察者对象同时监听某一个主题对象,当一个对象发生改变时 ...

  10. Blazor+Dapr+K8s微服务之事件发布订阅

    我们要实现的是:在blazorweb服务中发布一个事件,并传递事件参数,然后在serviceapi1服务中订阅该事件,接收到blazorweb服务中发布的事件和参数. 1         在blazo ...

随机推荐

  1. 仿微博——MJExtension之字典转模型

    1.模型类中定义好属性 2.用AFN请求下来的数据保存到字典中 3.从字典中取出微博字典数组 //微博字典数组 NSArray *restrictArray = responseObject[@&qu ...

  2. 转:postgresql:pg_restore: [archiver] input file does not appear to be a valid archive的解决方法

      使用ps_restore恢复备份数据库出错:pg_restore: [archiver] input file does not appear to be a valid archive 使用pg ...

  3. C语言学习--链表

    #include "node.h" #include<stdio.h> #include<stdlib.h> //typedef struct _node ...

  4. BZOJ1709: [Usaco2007 Oct]Super Paintball超级弹珠

    1709: [Usaco2007 Oct]Super Paintball超级弹珠 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 324  Solved: ...

  5. Yarn应用程序运行流程剖析

    Yarn(Yet Another Resource Negotiator)是一个Hadoop集群资源管理系统,Hadoop2时被引入,旨在提高MapReduce的性能,但YARN已足够通用,使得它可以 ...

  6. HBase Endpoint

    引言   假设HBase某张表有1000个Region,里面存储着100万行数据,现在需要统计满足某些条件的行数,普通的做法是使用Filter(过滤条件),通过HBase API将满足过滤条件的行数据 ...

  7. 读取Word文档的标题

    一:描述,将读取的文档标题添加到下拉框中 二:代码 #region 方法:得到Word文档标题的内容 public static List<string> GetTitles(int j, ...

  8. 安装loadrunner11 ,出现如下错误如何解决?

    出现的问题是: 安装LoadRunner 11时弹窗提示"Micosoft Visual C++ 2005 SP1 可再发行组件包(X86):'命令行选项语法错误.键入命令 / ? 可获得帮 ...

  9. Tomcat启动时报错:java.net.BindException: Permission denied <null>:80 【转载】

    本文转载自: http://blog.sina.com.cn/s/blog_4550f3ca0101g37l.html   问题起因:做负载均衡时需要将Web工程与Wap工程同时部署在一台Suse服务 ...

  10. Migration workstation vms to openstack kvm

    Migration workstation vms to openstack kvm 分别分成(磁盘是否拆分,vms 是否 有多个磁盘驱动器) 1, linux迁移 vmware workstatio ...