vue原理

**在这个前端蓬勃发展的阶段，前端框架太多了，从原来的霸主jquery到现在的vue，react等等，不管前端怎么发展，理解js本质，框架运行的原理非常重要，作为我个人而言，我是看好react，weex，react native,现在看来weex还很难用，但是作为阿里投入那么多人力财力，肯定会开元出适合中国人使用的框架，只是时间问题，闲话不扯了，说一下vue的实现原理
**mvvm => 响应式 => diff算法 => vnode => vdom
**下面说一下初始化渲染和更新渲染

**初始化渲染=》mvvm的model只的是我们设置的data里面的数据，view是标签，当然严格来说不是真正的html，因为上面有我们的插值，有v-xx属性，vm其实就是model=>view就是我们的插值获取model中的变量，view=>model就需要我们处理了，vue也底层给我们实现了v-model，其实就是利用了value和input事件，在输入框输入时候出发input利用$emit把值赋值到value上，这样data里面的数据就改变了
**紧接着在触发Object隐式原形上有个definepropety方法get方法，将获得到的值放大watcher收集器里面
下面展示一些

Object.defineproperg(data,key,{
	get () {
		return data[key]
	},
	set (newValue) {
		if (newValue !== data[key]) {
			data[key] = newValue
		}
		return data[key]
	}
})

**然后调启diff算法，对比变化，将变化的值给到render
**redner将模板编译成vnode，利用patch推到vdom里，当然这个步骤就不用我们操作了，咱们在配置文件里引入的vue-loade，它给我们做了
**vdom会一次性给我们挂载到真实dom上
**更新渲染=》update将data数据改变
**紧接着在触发Object隐式原形上有个definepropety方法set方法，将获得到的值放大watcher收集器里面
下面展示一些

Object.defineproperg(data,key,{
	get () {
		return data[key]
	},
	set (newValue) {
		if (newValue !== data[key]) {
			data[key] = newValue
		}
		return data[key]
	}
})

**然后调启diff算法，对比变化，将变化的值给到render
**redner将模板编译成vnode，利用patch推到vdom里，当然这个步骤就不用我们操作了，咱们在配置文件里引入的vue-loade，它给我们做了
**vdom会一次性给我们挂载到真实dom上