(四)JS学习笔记 - 模式 - 观察者模式
理解观察者模式
简单的讲,一个对象作为特定任务或是另一对象的活动的观察者,并且在这个任务或活动发生时,利用事件的形式通知观察者。
观察者的使用场合
当一个对象的改变需要同时改变其它对象,并且它不知道具体有多少对象需要改变的时候,就应该考虑使用观察者模式。
例如,用户A,B,C分别订阅某服务,当服务有更新是可设定更新、下载等操作。
模拟实现
定义Observable对象,其内部包含了2个方法:add(订阅)与fire(发布)方法
// 观察者
var Observable = {
callbacks: [],
add: function(fn) {
this.callbacks.push(fn);
},
fire: function() {
this.callbacks.forEach(function(fn) {
fn();
})
}
}
订阅
Observable.add(function() {
console.log(1);
})
Observable.add(function() {
console.log(2);
})
发布
Observable.fire(); // 1, 2
实际应用
实际业务中,如请求某个ajax后需要执行多个方法,数据处理、渲染页面、其他业务等,可以使用观察者
Observable.add(function() {
//pocessData
})
Observable.add(function() {
$('test').html(data.a)
$('test2').html(data.b)
$('test3').html(data.c)
})
Observable.add(function() {
//pocessOther
})
$.ajax({
url: "test.html",
context: document.body
}).done(function(data) {
Observable.fire(data)
})
(四)JS学习笔记 - 模式 - 观察者模式的更多相关文章
- js学习笔记:webpack基础入门(一)
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- WebGL three.js学习笔记 使用粒子系统模拟时空隧道(虫洞)
WebGL three.js学习笔记 使用粒子系统模拟时空隧道 本例的运行结果如图: 时空隧道demo演示 Demo地址:https://nsytsqdtn.github.io/demo/sprite ...
- 《Linux内核设计与实现》第四章学习笔记
<Linux内核设计与实现>第四章学习笔记 ——进程调度 姓名:王玮怡 学号:20135116 一.多任务 1.多任务操作系统的含义 多任务操作系统就是能同时并发地交 ...
- 《Linux内核设计与实现》第四章学习笔记——进程调度
<Linux内核设计与实现>第四章学习笔记——进程调 ...
- 基于jquery的插件turn.js学习笔记
基于jquery的插件turn.js学习笔记 简介 turn.js是一个可以实现3d书籍展示效果的jq插件,使用html5和css3来执行效果.可以很好的适应于ios和安卓等触摸设备. How it ...
- 系列文章--Node.js学习笔记系列
Node.js学习笔记系列总索引 Nodejs学习笔记(一)--- 简介及安装Node.js开发环境 Nodejs学习笔记(二)--- 事件模块 Nodejs学习笔记(三)--- 模块 Nodejs学 ...
- WebGL three.js学习笔记 6种类型的纹理介绍及应用
WebGL three.js学习笔记 6种类型的纹理介绍及应用 本文所使用到的demo演示: 高光贴图Demo演示 反光效果Demo演示(因为是加载的模型,所以速度会慢) (一)普通纹理 计算机图形学 ...
- Node.js学习笔记(1):Node.js快速开始
Node.js学习笔记(1):Node.js快速开始 Node.js的安装 下载 官方网址:https://nodejs.org/en/ 说明: 在Windows上安装时务必选择全部组件,包括勾选Ad ...
- Vue.js学习笔记(2)vue-router
vue中vue-router的使用:
随机推荐
- IE的有条件注释详解
IE的有条件注释是一种专有的(因此是非标准的).对常规(X)HTML注释的Miscrosoft扩展.顾名思义,有条件注释使你能够根据条件(比如浏览器版本)显示代码块.尽管是非标准的,但是有条件注释对于 ...
- 兄弟连面试宝典php
学历这个事情是企业招聘经常设置的一道门槛,我们不能说学历高就能力高,也不能说学历低能力就差,那如何辩证回答这个问题呢?回答提示:学历不一定完全代表能力,虽然我的学历不够硬但是我会在技术上更努力更认真, ...
- Delphi XE7下 Intraweb 发布为ASP.NET应用程序
一.XE7下Intraweb开发这里就不说了,重点是在开发Intraweb时与ISAPI不同之处要选择 IW library,编译成DLL文件. 二.网站的配置 1.这是站点的物理路径,c:\site ...
- JSP与Servlet之间传值
Jsp与Servlet之间的传值有两种,一种是Jsp传值给Sevlet,另一种是Servlet传值给Jsp:使用request.response对象完成传值,具体实现如下: 1.JSP传值给Servl ...
- JAVA构造方法,继承关系和SUPER关键字
SUPER可调用父类的构造方法,但要注意默认调用和参数调用. 同时,在继承类时,可以用SUPER调用其它非构造方法哟. class Test extends Object{ public Test() ...
- [LeetCode 116 117] - 填充每一个节点的指向右边邻居的指针I & II (Populating Next Right Pointers in Each Node I & II)
问题 给出如下结构的二叉树: struct TreeLinkNode { TreeLinkNode *left; TreeLinkNode *right; TreeLinkNode *next; } ...
- HDU 2187 A sequence of numbers
题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=2817 题意: 给定三个数,判断是等差数列还是等比数列,然后输出第k项. 做法:直接判断即可 #inc ...
- java基础知识(一)
基本特征:封装性,继承性,多态性 一些新特征: 静态导入:import static 包名 可变参数的函数:add(int -x) 增强版for循环: for(int x:xs) 自动拆箱: 基本类型 ...
- 【Ruby on Rails学习二】在线学习资料的整理
由于工作任务重,时间紧,没有太多学习的时间,大致找了些在线学习资料,这里做个整理,希望对同样准备学习的朋友有帮助 在线文档类: Ruby on Rails 实战圣经 使用 Rails 4.2 及 R ...
- 预处理、const与sizeof相关面试题
1.用预处理指令#define 声明一个常数,用以表明一年中有多少秒(忽略闰年问题) #define语法知识: (1) 不能以分号结束,括号的使用防止宏定义展开后的二义性. (2) 预处理器将为你计算 ...