SOURCE

const data = {
    name: 'CalDey'
}

document.write(data.name)

observer(data);

function observer(target) {
    if (typeof target !== 'object' || target == null) {
        return target;
    }

    for (let key in target) {
        defineReactive(target, key, target[key])
    }

    function defineReactive(target, key, value) {
        Object.defineProperty(target, key, {
            get() {
                return value;
            },
            set(newVal) {
                if (newVal !== value) {
                    value = newVal;
                    alert('更新视图')
                }
            }
        })
    }
}

oBtn = document.getElementsByTagName('button')[0];
oBtn.addEventListener('click', function() {
    data.name = 'Thomas'
    document.write(data.name)
})

<h1>实现简易Vue响应式</h1>
<button>更改数据</button>