这不是原创文章,主要是写给自己看的。原文比较详细容易让人,我提取最简单最好理解的部分,便于我以后用到。参考http://www.cnblogs.com/TomXu/archive/2012/03/02/2355128.html。

function Observer(){
this.fns=[];
}
Observer.prototype={
//订阅
subscribe:function(fn){
this.fns.push(fn);
},
//退订
unsubscribe:function(fn){
this.fns=this.fns.filter(
function(el){
if(el!==fn){
return true;
}
}
)
},
//发布
update:function(o,thisObj){
var scope=thisObj || window;
this.fns.forEach(
function(el){
el.call(scope,o);
});
}
}
var o=new Observer;
var f1=function(data){
console.log('Robbin: ' + data + ', 赶紧干活了!');
};
var f2 = function (data) {
console.log('Randall: ' + data + ', 找他加点工资去!');
};
var f3 = function (data) {
console.log('Li: ' + data + ', 我要揍他!');
};
//f1,f2,f3订阅了
o.subscribe(f1);
o.subscribe(f2);
o.subscribe(f3);
//f1取消了订阅
o.unsubscribe(f1);
//发布
o.update('Tom回来了'); //输出结果
//Randall: Tom回来了, 找他加点工资去!
//Li: Tom回来了, 我要揍他!

一个简单的观察者模式的JS实现的更多相关文章

  1. 从一个简单例子来理解js引用类型指针的工作方式

    <script> var a = {n:1}; var b = a; a.x = a = {n:2}; console.log(a.x);// --> undefined conso ...

  2. 一个简单且丑陋的js切换背景图片基础示例

    不多说,直接上代码,非常基础的一个原生js切换元素背景图片范例 <html> <head> <meta http-equiv="Content-Type&quo ...

  3. 记一个简单的webpack.config.js

    module.exports = { entry: './basic/app.js', output: { path: './assets/', filename: '[name].bundle.js ...

  4. 无聊的人用JS实现了一个简单的打地鼠游戏

    直入正题,用JS实现一个简单的打地鼠游戏 因为功能比较简单就直接裸奔JS了,先看看效果图,或者 在线玩玩 吧 如果点击颜色比较深的那个(俗称坏老鼠),将扣分50:如果点击颜色比较浅的那个(俗称好老鼠) ...

  5. 用JS做一个简单的电商产品放大镜功能

    使用js制作一个简单的产品放大图 购物网站的产品页经常会放有一个产品展示图区.该图区有一个功能就是产品图的放大功能,移动左侧的焦点区域,可以放大细节部分观看,详情如下图.实现该功能的方法也非常简单. ...

  6. 通过Knockout.js + ASP.NET Web API构建一个简单的CRUD应用

    REFERENCE FROM : http://www.cnblogs.com/artech/archive/2012/07/04/Knockout-web-api.html 较之面向最终消费者的网站 ...

  7. 分享:计算机图形学期末作业!!利用WebGL的第三方库three.js写一个简单的网页版“我的世界小游戏”

    这几天一直在忙着期末考试,所以一直没有更新我的博客,今天刚把我的期末作业完成了,心情澎湃,所以晚上不管怎么样,我也要写一篇博客纪念一下我上课都没有听,还是通过强大的度娘完成了我的作业的经历.(当然作业 ...

  8. 【 D3.js 入门系列 --- 3 】 做一个简单的图表!

    前面说了几节,都是对文字进行处理,这一节中将用 D3.js 做一个简单的柱形图. 做柱形图有很多种方法,比如用 HTML 的 div 标签,或用 svg . 推荐用 SVG 来做各种图形.SVG 意为 ...

  9. js 排列 组合 的一个简单例子

    最近工作项目需要用到js排列组合,于是就写了一个简单的demo. 前几天在网上找到一个写全排列A(n,n)的code感觉还可以,于是贴出来了, 排列的实现方式: 全排列主要用到的是递归和数组的插入 比 ...

随机推荐

  1. git-【四】撤销修改和删除文件操作

    一:撤销修改: 比如我现在在readme.txt文件里面增加一行 内容为555555555555,我们先通过命令查看如下: 在未提交之前,发现添加5555555555555内容有误,所以得马上恢复以前 ...

  2. A Basic Example of Threads Synchronization in Python, python中的线程同步示例

    http://zulko.github.io/blog/2013/09/19/a-basic-example-of-threads-synchronization-in-python/ We will ...

  3. Python第一弹--------初步了解Python

    Python是一种跨平台的语言,这意味着它能够运行在所有主要的操作系统中. 语法规范几乎同C语言. 字符串: 当像Python输入一个字符串时,首先要输入一个引号.单引号.双引号.三引号三者等价.通常 ...

  4. 安装完C++builder6.0启动的时候总是出现无法将'C:\Program Files\Borland\CBuilder6\Bin\bcb.$$$'重命名为bcb.dro

    :兼容性问题  运行前右键属性“兼容性”-尝试不同的兼容性.比如“windows 8”

  5. 临时表单导出Excel

    function ExportExcel(url, vals) { var form = jQuery("<form action='" + url + "' me ...

  6. linux服务器查看IO

    为了方便各位和自己今后遇到此类问题能尽快解决,我这里将查看linux服务器硬盘IO访问负荷的方法同大家一起分享: 首先 .用top命令查看 top - 16:15:05 up 6 days,  6:2 ...

  7. 026-B树(一)

    1.内节点:非根非叶子节点,即非根的分支节点. 2.名称:B-树=B树=平衡多路查找树. 3.定义:m阶B树. (0).根节点孩子数rootChildNum范围:若没有孩子节点则孩子数为0,若有孩子则 ...

  8. 24UDP通信

    使用Qt提供的QUdpSocket进行UDP通信.在UDP方式下,客户端并不与服务器建立连接,它只负责调用发送函数向服务器发送数据.类似的服务器也不从客户端接收连接,只负责调用接收函数,等待来自客户端 ...

  9. python socket编程 实现简单p2p聊天程序

    目标是写一个python的p2p聊天的项目,这里先说一下python socket的基础课程 一.Python Socket 基础课程 Socket就是套接字,作为BSD UNIX的进程通信机制,取后 ...

  10. P1757 通天之分组背包 / hdu1712 ACboy needs your help (分组背包入门)

    P1757 通天之分组背包 hdu1712 ACboy needs your help hdu1712题意:A[i][j]表示用j天学习第i个课程能够得到A[i][j]的收益,求m天内获得的收益最大值 ...