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 对象数据观察者实现的更多相关文章

  1. MVC 从控制器将数据对象赋值给前端JS对象

    @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport&quo ...

  2. 利用js对象将iframe数据缓存, 实现子页面跳转后, 返回时不丢失之前填写的数据

    利用js对象将iframe数据缓存, 实现子页面跳转后, 返回时不丢失之前填写的数据 实现描述:将数据存放在js对象中, 然后放在父页面的document对象中, 在页面刷新的时候将父页面的值取出来, ...

  3. JSON(JS 对象简谱,一种数据交换格式)

    JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式 存储和表示数据的文本格式 层次结构清晰.简洁 JSON是一个序列化的对象或数组 1.js ...

  4. JS对象复制

    在JavaScript很多人复制一个对象的时候都是直接用"=",因为大家都觉得脚本语言是没有指针.引用.地址之类的,所以直接用"="就可以把一个对象复制给另外一 ...

  5. JSON与js对象序列化

    JavaScript对象表示法(JavaScript Object Notation,简称JSON)是一种轻量级的数据交换格式,它基于js字面量表示法,是js的一个子集.虽然是一个js的子集但是他与语 ...

  6. zoeDylan.js框架-数据底层

    zoeDylan.js是墨芈自己写的一套前端框架,不过由于墨芈经验不足,所以框架内部代码有些混乱. 墨芈写这套框架的目的是为了存储以后做前端开发过程中的一些代码,简单的说这套框架就是一个大杂烩. 这套 ...

  7. 超实用的JavaScript代码段 Item8 -- js对象的(深)拷贝

    js 对象 浅拷贝 和 深拷贝 1.浅拷贝 拷贝就是把父对像的属性,全部拷贝给子对象. 下面这个函数,就是在做拷贝: var Chinese = { nation:'中国' } var Doctor ...

  8. jquery对象与js对象的相互转换

    jQuery对象转成DOM对象: 两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index); (1)jQuery对象是一个数据对象,可以通过[index]的方法,来得 ...

  9. JS对象与json字符串格式

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

随机推荐

  1. fatal: Authentication failed for又不弹出用户名和密码 解决办法

    各位,如果能弹出来,一定是你账号密码搞错了,就别继续看了.   image.png 切换命令行:   image.png 依然报错, 说到这个问题,又可以长篇大论了, 我使用的是tortoisegit ...

  2. Sumsets(数学)

    Sumsets Time Limit: 2000MS Memory Limit: 200000K Total Submissions: 14964 Accepted: 5978 Description ...

  3. KVM虚拟机的日常管理与配置

    1. 查看KVM虚拟机配置文件及运行状态(1) KVM虚拟机默认配置文件位置: /etc/libvirt/qemu/ autostart目录是配置kvm虚拟机开机自启动目录. (2) virsh命令帮 ...

  4. mask layer的遮罩层

    1. layer层 mask 遮罩效果 //渐变层 CAGradientLayer *gradientLayer = [CAGradientLayer layer]; gradientLayer.fr ...

  5. ZOJ - 3649 树上倍增

    题意:给出一个图,先求出最大生成树,然后多次询问树上路径\(u→v\)的有向最大极差\(max(a_i-a_j),i>j\),其中\(i\)和\(j\)指代节点在路径中出现的顺序 极差具有单调性 ...

  6. css实现视觉差的滚动

    之前在逛知乎的时候,发现知乎app首页中偶尔掺杂的广告图片,都是做的视觉差的效果,广告图片的向上速度明显比外面页面的上拉速度慢了很多,看起来很炫酷,然后在网上看了下,发现有很多js插件可以实现这种效果 ...

  7. SQL多字段排序

    emm 其实也没什么 就是写sql查询的时候 要对多个字段排序比如  查询原本的数据是 年份 科目 批次 2014 理科 本二2015 理科 本二 2015 理科 本一2016 理科 本二 2016 ...

  8. windows下实现屏幕分享(C#)

    采用UDP广播进行数据的传输,实现windows下进行低延迟的屏幕共享. 开发语言:C# 第三方组件:Redis 1.实现思路 总体流程图 DGIS.DesktopShare实现windows下屏幕分 ...

  9. 解决VS在高DPI下设计出的Winform程序界面变形问题

    在目前高分屏流行的情况下,windows缩放与布局仍然设置为100%就显得太小(特别是笔记本),通常会调整为125%或150%, VS在缩放与布局设置为非100%的时候,就会自动启动DPI感知模式,以 ...

  10. Canvas 同心圆旋转示例解析

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...