[vue3] isRef、isProxy、isReactive、isReadonly

vue3 对一些内置的属性，利用 ts 枚举提前定义，方便之后的使用，例如 isReactive、isReadonly 方法

export const enum ReactiveFlags {
  SKIP = '__v_skip',
  IS_REACTIVE = '__v_isReactive',
  IS_READONLY = '__v_isReadonly',
  IS_SHALLOW = '__v_isShallow',
  RAW = '__v_raw'
}

export interface Target {
  [ReactiveFlags.SKIP]?: boolean
  [ReactiveFlags.IS_REACTIVE]?: boolean
  [ReactiveFlags.IS_READONLY]?: boolean
  [ReactiveFlags.IS_SHALLOW]?: boolean
  [ReactiveFlags.RAW]?: any
}

一、isRef

判断是不是ref类型，根据 __v_isRef 属性来确认 true就是 ref 类型。
__v_isRef是只读属性

// core/packages/reactivity/src/ref.ts
export function isRef(r: any): r is Ref {
  return !!(r && r.__v_isRef === true)
}

二、 isReadonly

判断是不是 readonly, 根据 __v_isReadonly 属性来确认，true 就是 readonly 类型

// core/packages/reactivity/src/reactive.t
export function isReadonly(value: unknown): boolean {
  return !!(value && (value as Target)[ReactiveFlags.IS_READONLY])
}

三、isReactive

判断是不是 Reactive 类型，分为两种情况

1. 如果当前为 Readonly 类型，并且属性 __v_raw为true
2. 如果不是 Readonly 类型，但是 __v_isReactive 为true

这两种条件下为 Reactive 类型。

// core/packages/reactivity/src/reactive.ts
export function isReactive(value: unknown): boolean {
  if (isReadonly(value)) {
    return isReactive((value as Target)[ReactiveFlags.RAW])
  }
  return !!(value && (value as Target)[ReactiveFlags.IS_REACTIVE])
}

四、isProxy

如果是 Reactive 类型，或者是 Readonly 类型，那么就是 Proxy 类型

// core/packages/reactivity/src/reactive.ts
export function isProxy(value: unknown): boolean {
  return isReactive(value) || isReadonly(value)
}