习Vue已经有一段时间了，但未对其核心思想作自己的总结和理解
Vue核心思想有两个 : 数据驱动和组件化(系统组件)
数据驱动
数据驱动目的是让数据和DOM保持同步， 只要修改了data数据，DOM就会做相应的改变。Vue已经将这一逻辑封装好人工无需手动去操作DOM, Vue的数据驱动是利用了Object.defineProperty的特性, 以下使用原生js模拟了Vue的双向数据绑定:
<input type="text" id="inputText">
<br>
<span id="data"></span>
<script type="text/javascript">
var obj = {}
Object.defineProperty(obj, 'username', {
get: function () {
console.log('get')
},
set: function (newVal) {
console.log('set')
console.log(newVal)
document.getElementById('data').innerText = newVal
}
}) document.getElementById('inputText').addEventListener('keyup', function (event) {
obj.username = event.target.value
})
</script>
当改变了inputText的值，会自动调用set方法，而不用人工去操作。
组件化 (化整为零，可复用)
组件化比较好理解，目前前端项目中已经大量运用了模块化开发，组件化思想是从模块化引伸而来。例如，一个网站首页可以视作一个整体的组件，下图是官网截来.
app视为一个最大的组件，以下有header, content, side三个主要子组件组合而成。画成树状就是右图的组件树， 类似HTML中的DOM树。组件化还有一个特性是可复用 --x性，如下图header作为所有页面的公共头部，除了可以在首页中使用，还可以在其他页面 （如登录页，产品详情页）复用