实现 isReactive 和 isReadonly

主要思路

编写 isReactive 和 isReadonly 两个函数，返回对象身上的【IS_REACTIVE】或 【IS_READONYL】 属性值。 本质上：当访问对象身上的【IS_REACTIVE】或 【IS_READONYL】属性的时候，会进入get函数，在get函数中判断当前这个key是 【IS_REACTIVE】还是【IS_READONYL】，返回对应的isReadonly的值。

实现代码

export const enum ReactiveFlags {
  IS_REACTIVE = "__v_isReactive",
  IS_READONYL = "__v_isReadonly",
}
export function isReactive(value) {
  return value[ReactiveFlags.IS_REACTIVE]
} 

export function isReadonly(value) {
  return value[ReactiveFlags.IS_READONYL]
} 

细节

当判断一个普通对象的时候，由于普通对象没有经过proxy包装，进入普通对象的get函数之后没有对应的逻辑处理，因此会返回undefined（对象身上没有当前属性）。 而 经过reactive 和 readonly 包装过的值，会进入createGetter函数，当key === IS_REACTIVE 或 key === IS_READONYL的时候，就会触发对应的返回值。

处理：直接 !!undefined 将返回值变为false。

处理之后：