实现一个简单的类 Vue 框架（一） —— 数据的绑定之简单粗暴方法

Vue框架的核心概念一个是数据绑定，一个是虚拟Dom;先实现数据绑定。本框架命名为Sue。旨在模拟实现一个类Vue

一.最简单粗暴的数据绑定方法

要点：1.call的使用。2.for in 

代码：

/* 最简单粗暴的数据绑定 */
function Sue(options) {
    initData(this,options)
    if (typeof options.ready === 'function') {
        options.ready.call(this)
    }
}

function initData (vm,options) {
    var data = options.data;
    data = typeof data === 'function' ? data() : data || {};
    for (var key in data) {
        if (data.hasOwnProperty(key)) {
            vm[key] = data[key]
        }
    }
}

new Sue({
    data(){
        return {
            name:'ssx',
            age:18
        }
    },
    ready(){
        console.log("name",this.name);
        console.log("age",this.age);
    }
})

存在的问题：数据修改后不能监听到。所以需要有一种机制来实现数据修改可以监听到。看下篇文章：Vue数据监听的方法