(四)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的使用:
随机推荐
- 企业管理系统开发笔记(4)---后台登录_MVC过滤器
在asp.net时代,我们通常需要在后台的每个页面进行判断用户是否登录的状态,不管是通过session还是通过windows身份验证还是表单验证方式等等方法来对用户登录进行判断跳转.但是在mvc时代, ...
- 快速入门cocos2d-x jsbinding
如果你是一个cocos2d-x的老手,那你可以忽略这篇博文,如果你是一个接触过javascript,想通过HTML5做游戏的,但是苦于不知道如何下手,那么这篇博文可能会帮到你. cocos2dx-js ...
- NVIDIA 显卡温度提示过高,显卡温度高99度怎么办?
你可能没有在意您的NVIDIA(英伟达)显卡温度,那么你就不会知道显卡温度过高如何导致的呢?也不会知道如果去解决显卡温度过高的问题了,在此我希望在电脑玩游戏或者在办公中电脑速度快慢,或者发热的情况下, ...
- 转:MFC网络编程学习
要学习好网路编程,主要看以下几个方面: 1.掌握概念,诸如:同步(Sync)/异步(Async),阻塞(Block)/非阻塞(Unblock)等. 2.在实际Windows网络通信软件开发中,异步非阻 ...
- NUnit+mock+moq单元测试
[TestFixture] public class InstantBatchBuyTest { private string _mallAbc; private string _itemCode; ...
- try catch 学习记入
执行过程 public void method(Action action) { //2.method执行中 try { action(); //3.调用委托 "; //如果action执行 ...
- DUBBO安装配置注意事项
DUBBO安装配置注意事项 参考URL:http://blog.csdn.net/lichunan/article/details/40349645 ====== 管理端: 记得更改TOMCAT的端口 ...
- OCX控件的注册卸载,以及判断是否注册
方法一:在dos或Windows命令行下运行:regsvr32 ocxname.ocx 注册 示例:regsvr32 netshare.ocx //注册netshare.ocx控件regsvr ...
- AOJ 0118 深度优先搜索
日文题... 题意:一个面积为H*W的果园,种了苹果,梨和蜜柑.相邻(上下左右)的果树属于同一个区域,问果园共有多少个区域. 分析:迷宫问题.对于每一个格子,可以用深度优先搜索把相同果树的格子遍历并标 ...
- Storm实现单词计数
package com.mengyao.storm; import java.io.File; import java.io.IOException; import java.util.Collect ...