1. 程式人生 > >vue中資料雙向繫結的實現原理

vue中資料雙向繫結的實現原理

* Object.defineProperty()
        *   對物件的屬性進行 定義/修改
        * */

        let obj = {x:10}
        // 這兩種方式都相對來說比較簡單,直接,但是有些時候我們需要對物件的屬性的修改和增加進行必要的干預
//        obj.y = 20;
//        obj.x = 100;
//        obj.x = 'abc';
//
//        let arr = [1,2,3];
//        arr.length = 'abc';//不可更改
//        console.log(arr);

//        console.log(obj.x);
// delete obj.x; // console.log(obj); Object.defineProperty(obj, 'y', { configurable: false, //設定是否可刪除 false為不可刪除 value: 100 }); console.log(obj); delete obj.y;//刪除 console.log(obj); //設定物件某個屬性值的時候,順便設定它的屬性。enumerable 可列舉 configurable 可以刪除否 writable 可改值否
Object.defineProperty(obj, 'z', {//enumerable 可列舉(沒有則新新增) enumerable: true,//為false時,for..in object.keys json.stringfy 不能取到該z屬性 value: 10000 }); for (var attr in obj) { console.log(attr); } Object.defineProperty(obj, 'm', { writable:
false,//可更改 value: 9 }); console.log(obj); obj.m = 100; console.log(obj);