vue3响应式原理

 通过Proxy(代理): 拦截对data任意属性的进行操作, 包括属性值的增删改查

 通过 Reflect(反射): 动态对被代理对象的相应属性进行特定的操作

通过采用两者结合使用的方式实现响应式

Proxy 对象用于创建一个对象的代理,从而实现基本操作的拦截和自定义(如属性查找、赋值、枚举、函数调用等)。

参数:
target:要使用 Proxy 包装的目标对象(可以是任何类型的对象,包括原生数组,函数,甚至另一个代理)。

handler:一个通常以函数作为属性的对象,各属性中的函数分别定义了在执行各种操作时代理 p 的行为。

Reflect 是一个内置的对象,它提供拦截 JavaScript 操作的方法。这些方法与proxy handlers (en-US)的方法相同。Reflect不是一个函数对象,因此它是不可构造的。

静态方法:

Reflect.apply(target, thisArgument, argumentsList):对一个函数进行调用操作,同时可以传入一个数组作为调用参数

Reflect.construct(target, argumentsList[, newTarget]):对构造函数进行 new 操作,相当于执行 new target(...args)

Reflect.defineProperty(target, propertyKey, attributes):如果设置成功就会返回 true

Reflect.deleteProperty(target, propertyKey):相当于执行 delete target[name]

Reflect.get(target, propertyKey[, receiver]):获取对象身上某个属性的值,类似于 target[name]

Reflect.getOwnPropertyDescriptor(target, propertyKey):如果对象中存在该属性,则返回对应的属性描述符,否则返回 undefined

Reflect.ownKeys(target):返回一个包含所有自身属性(不包含继承属性)的数组

Reflect.set(target, propertyKey, value[, receiver]):将值分配给属性的函数。返回一个Boolean,如果更新成功,则返回true

Reflect.setPrototypeOf(target, prototype):设置对象原型的函数。返回一个 Boolean,如果更新成功,则返回 true

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值