## computed和watch的区别 computed: 1. computed 是计算属性，也就是计算值，适⽤于计算⽐较消耗性能的计算场景 2. computed 具有缓存性，computed的值在getter执⾏后是会缓存的，只有在它依赖的属性值改变之后，下⼀次获取 computed的值时才会重新调⽤对应的getter来计算 watch: 1. 更多的是「观察」的作⽤，类似于某些数据的监听回调，⽤于观察 props $emit 或者本组件的值，当数据变化时来执 ⾏回调进⾏后续操作 2. ⽆缓存性，⻚⾯重新渲染时值不变化也会执⾏ ⼩结: 1. 当我们要进⾏数值计算，⽽且依赖于其他数据，那么把这个数据设计为computed --适用于数值计算，并且依赖于其他属性时。因为可以利用缓存特性，避免每次获取值，都需要重新计算 2. 如果你需要在某个数据变化时做⼀些事情，使⽤watch来观察这个数据变化----适用于数据变化时执行异步或开销比较大的操作。 ## data为什么必须是一个函数 对象在栈中存储的都是地址，函数的作用就是属性私有化，保证组件修改自身属性时不会影响其他复用组件 如果不用函数的话，实例化的组件是共享同样的一个data对象，当你修改一个属性的时候，data也恢复阿生改变。 当data是一个函数的时候，每个实例的data属性都是独立的，不会相互影响 ----- **data属性必须是一个函数**，而且这个函数返回一个对象，对象内部保存着数据 原因： Vue让每个组件对象都返回一个新的对象，因为如果是同一个对象的，组件在多次使用后会相互影响。 >组件中的data写成一个函数，数据以函数返回值形式定义， 这样每复用一次组件，就会返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，让各个组件实例维护各自的数据。每个实例可以维护一份被返回对象的独立的拷贝 而单纯的写成对象形式，就使得所有组件实例共用了一份data，就会造成一个变了全都会变的结果