ref
- 作用：定义一个响应式的数据
- 语法：const xxx = ref(内容) 创建一个包含响应式数据的引用对象 JS中操作数据：x x x.value 模版中读取数据：不需要.value,直接{{xxx}}
- 备注： 接收的数据可以是：基本类型，也可以是对象类型 基本类型的数据：响应式依然是靠object.defineProperTy的get与set完成的 对象类型的数据：内部‘’求助‘’了
vue3.0中的一个新函数--- reactive函数
reactive函数
- 作用：定义一个对象类型的响应式函数（基本类型别用它，用ref函数）
- 语法：const代表对象=reactive（被代理对象）接收一个对象（或数组），返回一个迭代对象（proxy对象） reactive定义的响应式数据是‘’深层次的‘’ 内部基于ES6和Proxy实现，通过代理对象操作源对象内部数据都是响应式的
vue2的响应式 实现原理：
-
1.对象类型：通过object.defineProperty()对属性的读取，修改进行拦截（数据劫持） -
2.数组类型：通过重写更新数组的一系列方法来实现拦截。（对数组的变更方法进行了包裹）。 -
object.defineProperty(data,'count',{ get(){}, Set(){}})
存在问题：
- 1.新增属性，删除属性，界面不会更新
- 2.直接通过下标修改数组，界面不会自动更新
vue3的响应式：
- 实现原理：通过proxy（代理）：拦截对象中任意属性的变化，
- 包括：属性的读写，属性的添加，属性的删除 通过reflect（反射）：对被代理对象的属性进行操作
MDN文档中描述的proxy与reflect
- proxy：
https//developer.mozilla.org/zh-CN/docs/Web/JavaScript/Refernce/Global_Objects/Proxy
- Reflect：
https//developer.mozilla.org/zh-CN/docs/Web/JavaScript/Refernce/Global_Objects/Reflect
