js31---观察者模式
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type=text/javascript charset=utf-8> //发布者(被观察者)
var Publish = function(name){
this.name = name ;
this.subscribers = [];//所有的订阅者数组(每一个元素是函数类型fn)
}; //发布者发布消息
Publish.prototype.deliver = function(news){//当成员函数看
var publish = this ;
this.subscribers.forEach(function(fn){//fn是遍历过程中每一个元素
fn(news,publish); //把新消息发给一个订阅者
});
return this ; //return this 可以继续调用本函数或其他函数
}; Function.prototype.subscribe = function(publish){//当成员函数看
var sub = this;
//some:数组的每一个元素,如果其中有一个返回true,那么整体返回true
var alreadyExists = publish.subscribers.some(function(item){
return item === sub ;
});
//如果当前出版社里不存在这个人 则将其加入其中
if(!alreadyExists){
publish.subscribers.push(this);
}
return this; //return this 可以继续调用本函数或其他函数
}; Function.prototype.unsubscribe = function(publish){//当成员函数看
var sub = this ;
// filter (过滤函数:循环便利数组的每一个元素,执行一个函数如果不匹配,则删除该元素)
publish.subscribers = publish.subscribers.filter(function(item){
return item !== sub ;
});
return this; //链式编程
}; //发布者对象
var pub1 = new Publish('第一报社'); //观察者(订阅者)
var sub1 = function(news){ //sub1当成函数地址,当成普通变量看,也就是sub1类型是函数类型而已。
alert(arguments[1].name + ':' + news + "sub1");
};
var sub2 = function(news){
alert(arguments[1].name + ':' + news + "sub2");
}; sub1.subscribe(pub1);//订阅就是加入到发布者的数组中
sub2.subscribe(pub1); pub1.deliver('text1'); sub1.unsubscribe(pub1); //取消订阅
</script>
</head>
<body>
</body>
</html>
Function.prototype:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type=text/javascript charset=utf-8>
var Publish = function(name){
this.name = name ;
}; Function.prototype.subscribe = function(){ //加载函数类型的变量上
alert(123);
}; var g = function(){}
g.subscribe();//123 var f = new Publish("sss");
f.subscribe();//f.subscribe is not a function function h(){}
h.subscribe();//123 </script>
</head>
<body>
</body>
</html>
js31---观察者模式的更多相关文章
- 23种设计模式--观察者模式-Observer Pattern
一.观察者模式的介绍 观察者模式从字面的意思上理解,肯定有两个对象一个是观察者,另外一个是被观察者,观察者模式就是当被观察者发生改变得时候发送通知给观察者,当然这个观察者可以是多个对象,在项 ...
- 谈谈JS的观察者模式(自定义事件)
呼呼...前不久参加了一个笔试,里面有一到JS编程题,当时看着题目就蒙圈...后来研究了一下,原来就是所谓的观察者模式.就记下来...^_^ 题目 [附加题] 请实现下面的自定义事件 Event 对象 ...
- ObserverPattern(观察者模式)
import java.util.ArrayList; import java.util.List; /** * 观察者模式 * @author TMAC-J * 牵一发而动全身来形容观察者模式在合适 ...
- java观察者模式
像activeMQ等消息队列中,我们经常会使用发布订阅模式,但是你有没有想过,客户端时如何及时得到订阅的主题的信息?其实就里就用到了观察者模式.在软件系统中,当一个对象的行为依赖于另一个对象的状态 ...
- Backbone源码解析(六):观察者模式应用
卤煮在大概一年前写过backbone的源码分析,里面讲的是对一些backbone框架的方法的讲解.这几天重新看了几遍backbone的源码,才发现之前对于它的理解不够深入,只关注了它的一些部分的细节和 ...
- PHP 高级编程(3/5) - 使用SPL(标准PHP库)实现观察者模式
SPL(标准PHP库 - Standard PHP Library)是PHP5面向对象功能中重要的部分.原文解释是这样的“The Standard PHP Library (SPL) is a col ...
- 设计模式--观察者模式初探和java Observable模式
初步认识观察者模式 观察者模式又称为发布/订阅(Publish/Subscribe)模式,因此我们可以用报纸期刊的订阅来形象的说明: 报社方负责出版报纸. 你订阅了该报社的报纸,那么只要报社发布了新报 ...
- 学C#之设计模式系列笔记(2)观察者模式
一.借鉴说明 1.<Head First Design Patterns>(中文名<深入浅出设计模式>) 2.维基百科,观察者模式,https://zh.wikipedia.o ...
- PHP 观察者模式
观察者模式:定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新. [观察者模式中主要角色] 1.抽象主题(Subject)角色: 抽象主题提供了增加 ...
- GJM: 设计模式 - 观察者模式
GJM : 观察者模式 视频地址: http://www.imooc.com/learn/415 本课程通过一个天气预报的发布和订阅案例,来讲解观察者模式在Java项目中的应用.主要包括观察者模式的结 ...
随机推荐
- Linux Network配置
/etc/sysconfig/network [root@mytest ~]# cat /etc/sysconfig/network NETWORKING=yes HOSTNAME=mytest /e ...
- 洛谷 P2630 图像变换
P2630 图像变换 题目描述 给定3行3列的图像各像素点灰度值,给定最终图像,求最短.字典序最小的操作序列. 其中,可能的操作及对应字符有如下四种: A:顺时针旋转90度: B:逆时针旋转90度: ...
- QlikView随意改变图例的位置
组里面花了大价钱请人设计了一套UI的solution,只是是以站点思路设计的报表样式,可是该报表UI设计团队本身因为没有QlikView的背景,因此设计出来的报表不知道能不能再QlikView中实现, ...
- 用react native 做的一个推酷client
用react native 做的一个推酷client 仅供大家參考.仅仅为抛砖引玉.希望大家能以此来了解react.并编写出很多其它的优质的开源库,为程序猿做出贡献. 用的的组件: Navigator ...
- linux系统 硬链接和软链接
背景: 当几个用户同在一个项目里工作时.经常须要共享文件. 假设一个共享文件同一时候出如今属于不同用户的不同文件夹下.工作起来就非常方便. 比如B和C文件夹下有一文件D是两者都能够訪问和改动的共享文件 ...
- linux下u盘检測程序
获得U盘的插入或者拔取得信息的传统方法是在内核级执行hotplug程序.相关參数通过环境变量传递过来,再由hotplug通知其它关注hotplug的应用程序,可是效率比較低. ...
- C# 从磁盘中读取文件
读取txt文件 ------读取的数据比较小的时候: 如果你要读取的文件内容不是很多,可以使用 File.ReadAllText(filePath) 或指定编码方式 File.ReadAllText( ...
- startActivityForResult and onActivityResult
startActivityForResult and onActivityResult startActivityForResult 开启Activity 组织数据之后 发送,onActivityRe ...
- “==”和Equals区别
相信很多朋友在面对,对象判等时经常会犹豫是用“==”还是Equals呢?有时候发现两者得到的结果相同,但有时候有不同, 究竟在什么情况下"==" 会相等,什么情况下Equals会不 ...
- javaScript 立即执行函数学习笔记
立即执行函数: 即执行函数(Immediate Functions),立即执行函数模式是一种语法,可以让你的函数在定义后立即被执行 立即执行函数(immediate function)术语不是在ECM ...