由于接觸過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哈哈~