剩余参数，Array的扩展方法，String的扩展方法
第一节：Vue简介
定义：一套用于构建用户界面的渐进式JavaScript框架，vue可以自底向上逐层的应用。
官网：https://cn.vuejs.org/ 英文官网:https://vuejs.org/
优点：
1. 遵循MVVM 模式
2. 编码简洁, 体积小, 运行效率高, 适合移动/PC 端开发
3. 它本身只关注 UI, 也可以引入其它第三方库开发项目
第二节：Vue 语法
2.1 插值语法
概念：双大括号形式，用于解析标签体内容：{{msg}} msg:为表达式。
举例：
<div id="root">{{hello}}</div>
<script src="js/vue.js"></script>
<script>
Vue.config.productionTip = false;//阻止默认生成提示
new Vue({
el:"#root",
data:{
hello:"hello,vue!"
}
})
</script> 2.2 指令语法
概念：vue中有很多指令，他们用于解析标签属性、解析标签体内容、绑定事件，以 v- 开头。
举例：v-bind:href = "url" url:表达式，具有返回值
<div id="root">
<a v-bind:href="url">点击去百度</a>
<a :href="url">去百度(v-bind简写)</a>
</div>
<script>
Vue.config.productionTip = false;
new Vue({
el:"#root",
data:{
url:"http://www.baidu.com/"
}
})
</script> 第三节：数据绑定
3.1 单项数据绑定
概念：单向绑定(v-bind)：数据只能从data流向页面。
举例：
<div id="root">
<input type="text" name="" :value="msg"/>
</div>
<script>
Vue.config.productionTip = false;
new Vue({
el:"#root",
data:{
msg:"张三"
}
})
</script> 3.2 双向数据绑定
概念：双向绑定(v-model)：数据不仅能从data流向页面，还可以从页面流向data。
<div id="root">
<input type="text" name="" :value="msg"/>
</div>
<script>
Vue.config.productionTip = false;
new Vue({
el:"#root",
data:{
msg:"张三"
}
})
</script>
说明：v-model:value 可以简写为 v-model，v-model 一 般应用于输入类型的表单元素。
第四节：MVVM模型
概念：
M：模型(Model) ：data中的数据
V：视图(View) ：模板代码
VM：视图模型
(ViewModel)：Vue实例。
理解：VM用来把数据放到视图上，data中的所有属性都会放到VM上,在视图中都可以使用。
第五节：数据代理
5.1 vue数据代理概念
通过vm对象来代理data对象中属性的操作（读/写）
5.2 vue数据代理优势
更加方便的操作data中的数据
5.3 vue数据代理的原理
通过Object.defineProperty()把data对象中所有属性添加到vm上。为每一个添加到vm上的属性，都指定一个getter/setter去操作（读/写）data中对应的属性。
<div id="root"><h1>姓名：{{name}}</h1><h1>年龄：{{age}}</h1></div>
<script type="text/javascript">
Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示。
const vm = new Vue({
el:'#root',
data:{
name:'张三',
age:19
}
})
</script>
#web前端学习#
