介绍一个款可以在javascript对象上实现观察者模式的类库-Watch.js
2012-11-15 21:37 Zhuang miao 阅读(3890) 评论(5) 编辑 收藏 举报
最近发现一个比较有意思的js库可以为javascript的对象实现观察者模式,以往我们使用javascript实现的观察者模式都是通过使用回调函数配合dom上的event事件来操作的,而“Watch.js”可以为javascript的对象实现观察者模式,监听对象的变化。
watch.js目前主要可以做如下这些事情:
1,监听对象上一个或多个属性的改变,当改变后触发自定义事件。
2,批量观察一个对象上所有的属性,当有任何一个改变时,触发自定义事件。
3,可以取消订阅观察
4,你可以在你需要的时候,不用改变对象上的属性值,就可手动触发观察器。
5,可以与jquery兼容
下面看一个watch.js的基本使用,更多的代码可以参考本文最后的项目地址。
var ex1 = {
attr1: "initial value of attr1",
attr2: "initial value of attr2"
};
//监听ex1的attr1,当attr1值发送改变时候触发函数
watch(ex1, "attr1", function(){
alert("attr1 changed!");
});
//改变attr1值将弹出 attr1 changed!
ex1.attr1 = "other value";
attr1: "initial value of attr1",
attr2: "initial value of attr2"
};
//监听ex1的attr1,当attr1值发送改变时候触发函数
watch(ex1, "attr1", function(){
alert("attr1 changed!");
});
//改变attr1值将弹出 attr1 changed!
ex1.attr1 = "other value";
该类库内部由于目前是使用__defineSetter__与__defineGetter__实现,所以目前只能工作在如下浏览器中。
* IE 9+, FF 4+, SF 5+, WebKit, CH 7+, OP 12+, BESEN, Rhino 1.7+不过开发者声称在一下次的更新中将会兼容所有浏览器(我还没想明白在IE8以前如何实现,有高人可以指点一下)。有兴趣的朋友也可以在github关注这个项目。
项目地址:https://github.com/melanke/Watch.JS