文章预览
本文作者系360奇舞团前端开发工程师 Proxy 的核心机制 在 Vue 3 中,Proxy 主要用于 拦截对象的基本操作 ,包括 属性读取(get)、修改(set)、删除(deleteProperty) 等。这是 Vue 3 取代 Object.defineProperty 的根本原因。 Proxy 允许拦截的操作: 操作 作用 get(target, key, receiver) 读取属性时触发 set(target, key, value, receiver) 设置属性时触发 deleteProperty(target, key) 删除属性时触发 has(target, key) 判断 key 是否存在(key in obj) ownKeys(target) 获取对象的所有键(Object.keys(obj)) apply(target, thisArg, args) 代理函数调用 construct(target, args) 代理 new 操作符 Proxy 的核心实现 让我们通过一个 手写 Proxy 劫持 的例子,模拟 Vue 3 响应式数据的基本实现: const handler = { get (target, key) { console . log ( `读取属性: ${key} ` ); return Reflect . get (target, key); }, set (target, key
………………………………