### reactive()
返回一个对象的响应式代理。一般用于定义复杂数据类型的响应式。
响应式转换是“深层”的：它会影响到所有嵌套的 property。一个响应式对象也将深层地解包任何`ref`property，同时保持响应性。
**注意**: 当访问到某个响应式数组或 Map 这样的原生集合类型中的 ref 元素时，不会执行`ref`的解包。
```ts
const obj = reactive({ count: 0 })
obj.count++
```
**`ref`的解包**
```ts
const count = ref(1)
const obj = reactive({ count })
// ref 会被解包
console.log(obj.count === count.value) // true
// 会更新 `obj.count`
count.value++
console.log(count.value) // 2
console.log(obj.count) // 2
// 也会更新 `count` ref
obj.count++
console.log(obj.count) // 3
console.log(count.value) // 3
```
**注意**: 当访问到某个响应式数组或 Map 这样的原生集合类型中的`ref`元素时，不会执行`ref`的解包：
```ts
const books = reactive([ref('Vue 3 Guide')])
// 这里需要 .value
console.log(books[0].value)
const map = reactive(new Map([['count', ref(0)]]))
// 这里需要 .value
console.log(map.get('count').value)
```
将一个`ref`赋值给为一个`reactive`属性时，该`ref`会被自动解包：
```ts
const count = ref(1)
const obj = reactive({})
obj.count = count
console.log(obj.count) // 1
console.log(obj.count === count.value) // true
```
#### 为`reactive()`标注类型
`reactive()`也会隐式地从它的参数中推导类型：
```ts
import { reactive } from 'vue'
// 推导得到的类型：{ title: string }
const book = reactive({ title: 'Vue 3 指引' })
```
要显式地标注一个`reactive`property 的类型，我们可以使用接口：
```ts
import { reactive } from 'vue'
interface Book {
title: string
year?: number
}
const book: Book = reactive({ title: 'Vue 3 指引' })
```
或者，在调用`reactive()`时传入一个泛型参数，来覆盖默认的推导行为：
**不推荐使用`reactive()`的泛型参数，因为处理了深层次 ref 解包的返回值与泛型参数的类型不同。**
```ts
import { reactive } from 'vue'
interface Book {
title: string
year?: number
}
const book = reactive<Book>({ title: 'Vue 3 指引' })
```
