js 对象数据观察者实现
var observer = function (originalData) {
var newData = {};
newData.observer = {};
newData.$data = {};
for (var key in originalData) {
(function (key) {
newData.$data[key] = originalData[key];
Object.defineProperty(newData, key, {
set: function (val) {
newData.$data[key] = val;
this.dispatch(key, val);
},
get: function () {
return newData.$data[key];
}
});
newData.observer[key] = [];
})(key);
}
newData.on = function (key, callback) {
newData.observer[key].push(callback);
};
newData.dispatch = function (key, val) {
for (var i in newData.observer[key]) {
newData.observer[key][i](val);
}
};
return newData;
};
var data = observer({age: 1, name: 'mahuan'});
data.on('name', function (val) {
console.log('hello, ' + val);
});
data.on('age', function (val) {
console.log('oh, you are ' + val);
});
data.name = "mahuan";
data.age = 3;
hello, mahuan
oh, you are 3
js 对象数据观察者实现的更多相关文章
- MVC 从控制器将数据对象赋值给前端JS对象
@{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&quo ...
- 利用js对象将iframe数据缓存, 实现子页面跳转后, 返回时不丢失之前填写的数据
利用js对象将iframe数据缓存, 实现子页面跳转后, 返回时不丢失之前填写的数据 实现描述:将数据存放在js对象中, 然后放在父页面的document对象中, 在页面刷新的时候将父页面的值取出来, ...
- JSON(JS 对象简谱,一种数据交换格式)
JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式 存储和表示数据的文本格式 层次结构清晰.简洁 JSON是一个序列化的对象或数组 1.js ...
- JS对象复制
在JavaScript很多人复制一个对象的时候都是直接用"=",因为大家都觉得脚本语言是没有指针.引用.地址之类的,所以直接用"="就可以把一个对象复制给另外一 ...
- JSON与js对象序列化
JavaScript对象表示法(JavaScript Object Notation,简称JSON)是一种轻量级的数据交换格式,它基于js字面量表示法,是js的一个子集.虽然是一个js的子集但是他与语 ...
- zoeDylan.js框架-数据底层
zoeDylan.js是墨芈自己写的一套前端框架,不过由于墨芈经验不足,所以框架内部代码有些混乱. 墨芈写这套框架的目的是为了存储以后做前端开发过程中的一些代码,简单的说这套框架就是一个大杂烩. 这套 ...
- 超实用的JavaScript代码段 Item8 -- js对象的(深)拷贝
js 对象 浅拷贝 和 深拷贝 1.浅拷贝 拷贝就是把父对像的属性,全部拷贝给子对象. 下面这个函数,就是在做拷贝: var Chinese = { nation:'中国' } var Doctor ...
- jquery对象与js对象的相互转换
jQuery对象转成DOM对象: 两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index); (1)jQuery对象是一个数据对象,可以通过[index]的方法,来得 ...
- JS对象与json字符串格式
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...
随机推荐
- Linux 下面screen命令的用法
最近在使用阿里云的Linux 云服务做毕业设计遇到一些问题,我把java的jar运行程序上传之后,使用java -jar server命令之后程序开始正常运行,但是当我关闭终端的时候程 ...
- [HNOI2010] 合唱队
题目链接:https://www.luogu.org/problemnew/show/P3205 一个区间DP的题目. 设计状态为:\(dp1[i][j]\)表示当前区间为\([i,j]\),而且最后 ...
- Java内存管理笔记
java内存管理机制 在java中,内存管理由JVM完全负责,java中的"垃圾回收器"负责自动回收无用对象占据的内存资源,这样可以大大减少程序猿在内存管理上花费的时间,可以更集中 ...
- less配置
一.sublime text需要下载考拉,然后要 一直打开着: 1.编译工具用koala编译 下载地址:http://koala-app.com/index-zh.html 2.LESS中的注释: 可 ...
- javascript滚动到大于一定距离显示隐藏
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Sublime Text3 最新版3207 安装及破解
注:原文地址 https://www.abbeyok.com/archives/337 Sublime Text 3最近更新了新版本,最新版本:3207,之前的license无效了,新版破解方法如下: ...
- Lvs IP负载均衡技术
Lvs集群的通用结构 Lvs集群采用IP负载均衡技术,属于IP层的交换(L4),具有很好的吞吐率.调度器分析客户端到服务器的IP报头信息,将请求均衡地转移到不同的服务器上执行,且调度器自动屏蔽掉服务器 ...
- Oracle TNS Listener Remote Poisoning
Oracle TNS Listener Remote Poisoning 远程数据投毒漏洞(CVE-2012-1675) 1.漏洞简介: 允许攻击者在不提供用户名/密码的情况下,向远程“TNS Lis ...
- ubuntu安装gnome桌面
1. apt install gnome-shell 2. apt install ubuntu-gnome-desktop 3. apt install unity-tweak-tool 4. ap ...
- Machine learning 吴恩达第二周coding作业(必做题)
1.warmUpExercise: function A = warmUpExercise() %WARMUPEXERCISE Example function in octave % A = WAR ...