shallowRW

shallowRW方法用于创建一个浅层读写代理对象。与 RW 不同的是，shallowRW 不会对返回值再次包装为 Proxy，适用于需要在 Vue3 中深度监听的场景。支持 #/ 引用语法但不支持深层代理。

语法

javascript

shallowRW(data)
shallowRW(data)['#/value']
shallowRW(data)['#/$JSON_jsonStr/value']
shallowRW(data)['#/$Array_arr/0/value']

描述

shallowRW方法创建一个 Proxy 代理对象，允许通过特殊的 #/ 引用语法访问和修改深层嵌套的对象属性。与 RW 的核心区别在于：shallowRW 使用浅层 handler，不会对返回的对象或数组再次包装为 Proxy，而是直接返回原始值。

这一特性使得 shallowRW 适用于 Vue3 中需要深度监听（deep watch）的场景。RW 每次访问对象/数组属性时都会创建新的 Proxy，导致 Vue3 无法正确进行深度监听；而 shallowRW 返回原始对象引用，可以被 Vue3 的响应式系统正常追踪。

shallowRW 仍然支持 #/ 引用语法和所有内置修饰符（如 $JSON_、$Array_、$Item_ 等），可以在一次引用中完整访问深层属性路径，但不支持链式引用（即 shallowRW(target)['#/info']['#/version'] 无法工作，因为 ['#/info'] 返回的是原始对象而非 Proxy）。

参数

data object

需要创建代理的目标对象。

返回值

Proxy<object>

返回一个浅层 Proxy 代理对象。代理本身是 Proxy，但通过代理获取的嵌套对象/数组不会被再次包装为 Proxy，而是直接返回原始值。

注意事项

与 RW 的核心区别：shallowRW 不会对返回的对象/数组再次包装为 Proxy，而 RW 会对每一层对象/数组都包装为 Proxy
shallowRW 适用于 Vue3 深度监听场景，RW 则无法被 Vue3 正确深度监听
支持 #/ 引用语法，可以在一次引用中访问任意深层路径，如 shallowRW(target)['#/info/version']
不支持链式引用：shallowRW(target)['#/info']['#/version'] 无法工作，因为中间步骤返回的是原始对象而非 Proxy。请使用完整的 #/ 路径一次性访问
支持所有内置修饰符：$JSON_、$Array_、$Item_、$ItemString_、$String_、$Number_、$Boolean_、$Leaf_
支持空指针预防：引用路径中遇到 null/undefined 时自动创建容器（默认对象，$Array_ 修饰符时创建数组）
由于使用 Proxy 对象，不支持 IE 浏览器

示例

基础用法

与 RW 的区别

Vue3 深度监听场景

浏览器兼容

由于使用 Proxy 对象，不支持 IE 浏览器，详细浏览器兼容性参考MDN Proxy 浏览器兼容性

性能考虑

时间复杂度: O(d) - 引用路径解析采用迭代方式，d 为路径深度
空间复杂度: O(1) - 不会创建嵌套 Proxy，内存开销低于 RW
相比 RW，shallowRW 不对返回值包装 Proxy，减少了 Proxy 创建开销
引用路径解析采用迭代方式，避免深层嵌套导致的栈溢出
适用于 Vue3 深度监听场景，避免 RW 因频繁创建 Proxy 导致的响应式失效问题

shallowRW ​

语法 ​

描述 ​

参数 ​

返回值 ​

注意事项 ​

示例 ​

基础用法 ​

与 RW 的区别 ​

Vue3 深度监听场景 ​

浏览器兼容 ​

性能考虑 ​

相关函数 ​