关于 Reflect 的笔记

背景：Reflect 为了操作对象而提供的新Api 和 Proxy对象一样

特点

1. 将object 对象的一些明显属于语言内部的方法，放到Reflect 上处理；
2. 修改某些object返回的异常结果，让其变得更合理；
3. 让object操作都变成函数行为；
4. reflect对象上的方法与proxy对象的方法一一对应，只要是proxy上的方法，就能在Reflect对象上找到对应的方法；

 console.log('assign' in Object) // object使用命令式行为去操作
​console.log(Reflect.has(Object,'assign'))  // Object使用函数的行为去操作

方法

1. Reflect.get(target,name,receiver)方法 获取target对象上的name的value值

2. Reflect.set(target,name,value,receiver)方法 设置target对象上的name的value值，并且this修改receiver重新绑定

3. Reflect.has(obj,name)方法 对象上面是否存在某个属性

4. Reflect.deleteProperty(obj,name)方法 删除对象上某个属性

上述方法中第一个参数不是对象的话,会报错

1：使用Reflect.get()方法

语法：Reflect.get(target,name,receiver)

接收三个字段

• target:目标对象

• name:属性名

• receiver: this绑定的对象 接收对象

 let myObject = {
​foo: 1,
​bar: 2,
​get baz () {
​
•    return this.foo + this.bar
​}
​}
​console.log(Reflect.get(myObject,'foo')) // 1
​console.log(Reflect.get(myObject,'bar')) // 2
​console.log(Reflect.get(myObject,'baz')) // 3

1.1 使用receiver来指定数据

 let myObject1 = {
​foot: 1,
​bar: 2,
​get boo () {
​
•    return this.foot + this.bar
​}
​}
​
​
​let myReceiver = {
​foot: 2,
​bar: 4,
​}

name 在有get的情况下，则读取函数的this绑定receiver (this指向发生了改变)

 console.log('访问',myObject1.boo) // 3
​console.log('访问2',Reflect.get(myObject1,'boo',myReceiver)) // 6

tips: Reflect.get()的第一个参数必须是一个对象，否则会报错

2：使用Reflect.set()方法

通过Reflect.set方法设置target的name属性等于value

语法：Reflect.set(target,name,value,receiver)

接收四个字段

• target:目标对象

• name:属性名

• value:值

• receiver: this绑定的对象 接收对象

  let myObject2 = {
​foot: 1,
​set bar (value) {
​
•    return this.foot = value
​}
​}console.log('读取原有属性的值：',myObject2.foot) // 1
​Reflect.set(myObject2,'foot', 2)
​console.log('Reflect.set修改原有属性的值：',myObject2.foot)// 2
​Reflect.set(myObject2,'bar', 6)
​console.log('通过Reflect.set修改原有属性的值：',myObject2.foot) // 6

如果name属性设置了赋值函数，则赋值函数的this绑定receiver

  let myObject3 = {
​foo: 3,
​set bar (value) {
​
•    return this.foo = value
​}
​}
​
​
​let receiverMyObject = {
​foo: 0,
​}

通过Reflect.set()修改foo的值

Reflect.set(myObject3,'bar',2,receiverMyObject)
​
console.log('target原有的值',myObject3.foo)  // 3
​
console.log('this指向的receiver发生了变化：',receiverMyObject.foo) // 2

3：使用Reflect.has()方法

通过 Reflect.has()方法查看属性是否存在，返回boolean值

let obj1 = { a: 1 }

旧方法

console.log('a' in obj1) // true 

使用 Reflect.has()方法

语法：Reflect.has(obj,name)

console.log(Reflect.has(obj1,'a')) // true

4：删除属性操作

语法：Reflect.deleteProperty(obj,name)

 let obj2 = { title: '标题信息', name: '名称信息' }console.log('对象原有内容：', obj2) // {title: '标题信息', name: '名称信息'}

旧方法

delete obj2.title
console.log('使用旧方法删除的值：', obj2) // {name: '名称信息'}

使用Reflect.deleteProperty()进行删除

Reflect.deleteProperty(obj2,'name')
console.log('使用Reflect.deleteProperty()方法删除后的：', obj2) // { }

笔记，后续持续更新，敬请期待~