getter和setter怎么用
示例代码
getter ，关键词为 get ，用于获取一个值。定义时为函数，但是使用时不用加括号。
setter 用于对数据的改写
Object.defineProperty
示例代码
可以给对象添加属性value
可以给对象添加getter / setter
getter / setter用于对属性的读写进行监控
代理：
对myData对象的属性读写，全权由另一个对象vm负责
那么vm就是myData的代理
用vm.n来操作myData.n
vue 对 data 做了什么
当你创建一个实例时
const vm = new Vue({data: myData})
vue 会让 vm 成为 myData 的代理。
vue 会对 myData 的所有属性进行监控。
目的
你可以使用 this 来访问到 vm。 this.n === myData.n。
之所以要监控，就是防止 vue 无法得知 myData 的属性变化。
vue 得知属性变化才可以使用 render(data) 来更新 UI 和渲染页面。
数据响应式
响应式即对外界的变化做出的反应的一种形式。
const vm = new Vue({data:{n: 0}})
当修改 vm.n 或 data.n 时，render(data...) 中的 n 就会做出响应的响应。
这个联动的过程就是 vue 的 数据响应式。
vue 目前通过 Object.defineProperty 来实现数据响应式。
在 data 中添加属性
Vue 虽然对 data 中的属性（或对象中的属性）进行监听和代理，但是它却没有办法进行事先的监听和代理。
如果你在初始化 data 之后再添加属性，该如何实现？
一般对象
对于一般的对象来说，可以在 data 中预先把所有可能用到的属性全部写出来，这样并不需要新增属性，只需要改它。
也可以通过其他方法来添加属性。
在了解以上原理后，我们来了解 Vue 提供的一个 API：
Vue.set(object, key, value)
或
this.$set(object, key, value)
作用
- 在 data 中添加新的属性。
- 自动创建为它创建代理和监听（如果没有创建过）。
示例：
const Vue = window.Vue
new Vue({
data: {
obj: {
a: 0
}
},
template: `
<div>
{{obj.b}}
<button @click='one'>One</button>
</div>
`,
methods: {
one() {
Vue.set(this.obj, 'b', 1)
// 或 this.$set(this.obj, 'b', 1)
}
}
}).$mount('#app')
数组
因为数组本身的特殊性：数组的长度无法预测（比如所有用户的用户名，存在数组中），你无法使用 undefined 去为每一项占位，或一直使用 Vue.set( )方法。
- 你可以使用 push 方法
this.array.push('value')，但其实数组已经被 Vue 包装了新的 push 方法。 - 原理就是声明一个新的类来继承数组。
- 各种在 Vue 实例 中使用的特例方法， 详见
数组变异方法，一共有7个API。 - 这些方法 (API) 会自动处理对数组该项的监听和代理，并触发视图更新。