Js面向对象之观察者模式
//模拟一个目标可能拥有的一些列依赖
function ObserverList() {
this.observerList = [];
}; //添加一个观察者
ObserverList.prototype.Add = function (obj) {
return this.observerList.push(obj);
}; //清除所有观察者
ObserverList.prototype.Empty = function () {
this.observerList = [];
}; //获得所有观察者的数量
ObserverList.prototype.Count = function () {
return this.observerList.length;
}; //获取某个指定的观察者
ObserverList.prototype.Get = function (index) {
if (index > -1 && index < this.observerList.length) {
return this.observerList[index];
}
};
//插入一个观察者
ObserverList.prototype.Insert = function (obj, index) {
var pointer = -1;
if (index === 0) {
this.observerList.unshift(obj);
pointer = index;
} else if (index == this.observerList.length) {
this.observerList.push(obj);
pointer = index;
}
return pointer;
};
//从某个位置开始查找特定的观察者并返回观察者的索引值
ObserverList.prototype.IndexOf = function (obj, startIndex) {
var i = startIndex, pointer = -1;
while (i < this.observerList.length) {
if (this.observerList[i] == obj) {
pointer = i;
} i++;
}
return pointer;
}; //移除某个特定索引的观察者(如果存在)
ObserverList.prototype.RemoveIndexAt = function (index) {
if (index == 0) {
this.observerList.shift();
} else if (index == this.observerList.length - 1) {
this.observerList.pop();
}
}; //扩展对象
function extend(obj, extension) {
console.log(obj);
for (var k in obj) {
console.log(k);
extension[k] = obj[k]
}
}; //模拟一个目标对象,并模拟实现在观察者列表上添加、删除和通知观察者的能力
function Subject() {
this.observers = new ObserverList();
}; //目标添加一个观察者
Subject.prototype.AddObserver = function (observer) {
this.observers.Add(observer);
}; //目标对象移除某个观察者
Subject.prototype.RemoveObserver = function (observer) {
this.observers.RemoveIndexAt(this.observers.IndexOf(observer, 0));
}; Subject.prototype.RemoveAllObserver = function () {
this.observers = [];
} //模拟实现通知功能
Subject.prototype.Notify = function (context) {
var observerCount = this.observers.Count();
for (var i = 0; i < observerCount; i++) {
this.observers.Get(i).Update(context);
}
};
//模拟创建一个观察者
function Observer() {
this.Update = function () {
};
} var controlCheckbox = document.getElementById("mainCheckBox");
var removerObserver = document.getElementById("removerAllObserver");
var addBtn = document.getElementById("addNewObserver");
var container = document.getElementById("observerContainer");
extend(new Subject(), controlCheckbox); controlCheckbox["onclick"] = Function("controlCheckbox.Notify(controlCheckbox.checked)"); addBtn["onclick"] = AddNewObserver;
function AddNewObserver() {
var check = document.createElement("input");
check.type = "checkbox";
extend(new Observer(), check);
check.Update = function (value) {
this.checked = value;
};
controlCheckbox.AddObserver(check);
container.appendChild(check);
}
Js面向对象之观察者模式的更多相关文章
- js面向对象学习 - 对象概念及创建对象
原文地址:js面向对象学习笔记 一.对象概念 对象是什么?对象是“无序属性的集合,其属性可以包括基本值,对象或者函数”.也就是一组名值对的无序集合. 对象的特性(不可直接访问),也就是属性包含两种,数 ...
- 带你一分钟理解闭包--js面向对象编程
上一篇<简单粗暴地理解js原型链--js面向对象编程>没想到能攒到这么多赞,实属意外.分享是个好事情,尤其是分享自己的学习感悟.所以网上关于原型链.闭包.作用域等文章多如牛毛,很多文章写得 ...
- JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法
相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...
- JS面向对象(2) -- this的使用,对象之间的赋值,for...in语句,delete使用,成员方法,json对象的使用,prototype的使用,原型继承与原型链
相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...
- JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式
相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...
- js面向对象的实现(example 二)
//这个方法和上篇文章(js面向对象的实现(example 一))中的方法类似,但是更为简洁 //通过函数赋值的方式来构造对象 //同样通过闭包的方式来封装对象及内部变量 (function () { ...
- 浅谈JS面向对象之创建对象
hello,everybody,今天要探讨的问题是JS面向对象,其实面向对象呢呢,一般是在大型项目上会采用,不过了解它对我们理解JS语言有很大的意义. 首先什么是面向对象编程(oop),就是用对象的思 ...
- js面向对象,有利于复用
需求:在网页上添加个天气预报. 以前总是在需要执行js的地方,直接写function(){}.在需要同样功能的地方直接copy,或者稍微修改. 然后在网上看看有没有好点的方法,然后就看到js面向对象编 ...
- JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)
函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) { return i1 + i2;//如果不写return返回 ...
随机推荐
- js注册
ScriptManager.RegisterStartupScript(this, GetType(), "", "alert('修改失败!')", true) ...
- 最短路——弗洛伊德算法(floyd)
模板: #include <bits/stdc++.h> using namespace std; ][]; int n,m,x,z,y; <<; int main() { c ...
- oracle分页计算公式
//page是页数,rows是显示行数 int page=2; int rows=5; List<Articles> list=a.select(page*rows+1,(page-1)* ...
- bzoj4373:算数天才与等差数列
算术天才⑨非常喜欢和等差数列玩耍. 有一天,他给了你一个长度为n的序列,其中第i个数为a[i]. 他想考考你,每次他会给出询问l,r,k,问区间[l,r]内的数从小到大排序后能否形成公差为k的等差数列 ...
- 2017-10-18 NOIP模拟赛
纸牌游戏 #include<iostream> #include<cstdio> #include<ctime> #include<cstdlib> # ...
- Ubuntu16.04安装Nvidia显卡驱动+Cuda8.0+Cudnn6.0
一.安装Nvidia显卡驱动(gtx1050ti) 参考链接:Ubuntu16.04.2 LTS 64bit系统装机记录中的显卡驱动安装部分. 二.安装Cuda8.0 1.确定自己的系统信息,以Ubu ...
- 牛客假日团队赛1B.便便传送门(一)
链接:https://ac.nowcoder.com/acm/contest/918/B 题意: Farmer John最讨厌的农活是运输牛粪.为了精简这个过程,他制造了一个伟大的发明:便便传送门!与 ...
- 【ACM】阶乘之和 - 避免重复计算
阶乘之和 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述 给你一个非负数整数n,判断n是不是一些数(这些数不允许重复使用,且为正数)的阶乘之和,如9=1!+2!+3! ...
- sleuth使用说明(入门)
出发点: 微服务架构上通过业务来划分服务的,通过REST调用,对外暴露的一个接口,可能需要很多个服务协同才能完成这个接口功能,如果链路上任何一个服务出现问题或者网络超时,都会形成导致接口调用失败.随着 ...
- docker~aspnetcore2.0镜像安装软件的加速器
一般对于安装软件加速时,我们大多数会选择阿里云,而对于aspnetcore2.0这个进项来说,由于使用的是Debian操作系统,所有我们要找到它对应的mirror列表,下面是我整理的一个sources ...