常用的判断有四个，分别是：

• isRef()   判断是不是ref()定义的
• isReactive()  判断是不是reactive()定义的
• isReadonly()  判断是不是readonly()定义的
• isProxy()  判断底层是不是用到了proxy() ，其中reactive()或readonly()定义的都是

<template>
  <h3>我是App组件 --- {
   { num }}</h3>
  <p>姓名：{
   { person1.uname }} --- 年龄：{
   { person1.age }}</p>
  <p>只读的 姓名：{
   { person2.uname }} --- 年龄：{
   { person2.age }}</p>
</template>

<script setup>
import {
  reactive,
  readonly,
  ref,
  isRef,
  isReactive,
  isProxy,
  isReadonly,
} from 'vue'

let num = ref(100)
let person1 = reactive({
  uname: '张三',
  age: 24,
})
let person2 = readonly(person1)

// 判断是否为ref()定义的
console.log(isRef(num)) // true
// 判断是否为reactive()定义的
console.log(isReactive(person1)) // true
// 判断是否为isReadonly()定义的
console.log(isReadonly(person2)) // true
// 判断底层是不是用到了Proxy()   reactive()和isReadonly()定义的都是
console.log(isProxy(person1)) // true
console.log(isProxy(person2)) // true
console.log(isProxy(num)) // false
</script>