vueはObjectを使用する.definePropertyデータの変更をリスニングする

vue Objectの使い方defineProperty

/**
 *          
 *           
 */
const oldPropType = Array.prototype;
const newPropType = Object.create(oldPropType);
['push', 'prop', 'shift', 'unshift', 'sort', 'splice', 'reverse'].forEach(method => {
    newPropType[method] = function () {
        oldPropType[method].call(this, ...arguments);
        //    
        render();
    }
})

/**
 *        
 * @param bean     
 * @param key  
 * @param value  
 * @returns {*}
 */
function defineReactive(bean, key, value) {
    //            
    observer(value);
    //  defineProperty         
    Object.defineProperty(bean, key, {
        get() {
            return value;
        },
        set(newVal) {
            //                
            if (value === newVal) {
                return
            }
            //        
            value = newVal;
            //       
            render()
        }
    })
}

/**
 *     
 * @param data
 */
function observer(data) {
    //        
    if (Array.isArray(data)) {
        //                   ，              
        data.__proto__=newPropType;
        return;
    }
    //     ，                 
    if (typeof data === 'object') {
        for (const key in data) {
            defineReactive(data, key, data[key]);
        }
    }
}

/**
 *       
 */
function render() {
    console.log('    ')
}

/**
 * set  
 * @param data    
 * @param key     
 * @param value     
 * @returns {*}
 */
function $set(data,key,value) {
    if(Array.isArray(data)){
        data.splice(key,1,value)
        return
    }
    defineReactive(data,key,value);
    render()
    return value
}

/**
 * deltet  
 * @param data     
 * @param key      
 */
function $delete(data,key) {
    if(Array.isArray(data)){
        data.splice(key,1);
        return
    }
    delete data[key]
    render();
}
//  vue  data   
const data = {
        name: 'shu',
        obj: {
            age: 12,
            name: 'ce'
        },
        arr:[1,2]
    }
//     observer()        
observer(data)