由于接触过c#,swift等语言,对于属性有所了解,所以像a.name = "jack"
发生变化后,可以触发其他的操作并不觉得唐突。当有一天使用vue.js的时候发现。在js中竟然也可以这样做,简直太方便了。数据驱动view就是这样诞生的。
好奇心使然,还是研究了一下。这要感激ES5的访问器属性。get,set,跟c#中的属性非常的像。
vue其实就是将data = {...}
重新的定义了get和set。在set中使用订阅发布来实现数据的监听。
来个栗子:
var bind = function (obj, key, callback) {
var v = obj[key];
Object.defineProperty(obj, key, {
enumerable: true,
configurable: true,
get: function () {
return v;
},
set: function (value) {
var old = v;
v = value;
callback(old, value);
}
})
};
var a = { name: "austin" };
bind(a, "name", function (oldname, newname) {
alert("i'm " + newname + ", old name is " + oldname);
});
现在你只要修改a.name就会弹出一个对话框。其他的就自己想想吧。抛砖引个玉O(∩_∩)O哈哈~