13-Reflect

1、Reflect是什么？

答：为了操作对象而提供的一个API。

2、Reflect常见的静态方法有哪些？

答：一共有13个静态方法，目前先要求掌握的有：get, set， has， ownKeys.

3、如何利用Reflect查找对象的某个属性？如果该属性不存在，返回的值是什么？

答：利用Reflect的get方法。属性不存在时，返回undefined。代码如下：

var myObj = {
    foo: 1,
    bar: 2,
    get baz(){
        return this.foo + this.bar
    }
}


let a = Reflect.get(myObj,'foo');
let b = Reflect.get(myObj,'bar');
let c = Reflect.get(myObj,'baz');
let d = Reflect.get(myObj,'name')
console.log(a,b,c,d) //1,2,3,undefined

4、get方法里的第三个参数是做什么用的？

答：语法是Reflect（target, name, receiver），传递两个或三个参数。
如果target的name属性部署了读取函数（getter），则读取函数的this绑定target，如果存在receiver，则读取函数的this绑定receiver。代码如下：

var person={
    name:"Alice",
    age: 18,
    get say(){
        console.log(this.name + "今年" + this.age)
    }
}

let receiverObj = {
    name: "Tom",
    age: "27"
}

Reflect.get(person, 'say', receiverObj) //直接执行了这个方法，输出的内容为：Tom今年27

延伸：get的用法。

如果有一个数组list，list的每一项都是一个对象。对象里面包含有一个name属性。可以利用Reflect.get将list里面每个对象的name属性挑选出来，整理成一个数组。这样比for in

快的多。

5、set的用法 

var myObj = {
    foo: 1,
    set bar(value){
        return this.foo = value;
    }
}

Reflect.set(myObj, 'foo', 2);
console.log(myObj.foo) //2

6、set的第四个参数有什么用？

答：set的语法结构是：Reflect（obj, name, value, receiverObj）。如果name属性设置了赋值函数，则赋值函数的this指向receiverObj。

var myObj = {
    foo: 1,
    set bar(value){
        return this.foo = value;
    }
}

let receiverObj = {
    foo: 4
}

Reflect.set(myObj, 'foo', 2, receiverObj);
console.log(myObj.foo) //1
console.log(receiverObj.foo) //2

　　

 延伸：同get 一样，如果最后一位填写了receiverObj，就将this指向receiverObj。但是注意，这个的用法需要在目标对象上为这些属性设定get 和set 的方法。

7、has的用法

可以用来判断对象中是否存在某个属性。感觉这比proxy简单多了。

let person = {
    name: 'Alice',
    age: 18
}

let property = 'name'
console.log(Reflect.has(person,property))//true
console.log(Reflect.has(person,'hobby')) //false

8、ownKeys的用法

用来返回所有的对象里的所有属性名称。

let person = {
    name: 'Alice',
    age: 18
}

console.log(Reflect.ownKeys(person)) //Array(2) ["name", "age"]

9、观察者模式

函数自动观察数据对象。一旦对象有变化，函数就会自动执行。

它由两部分组成，观察目标和观察者。

let person = observable({
    name: 'Alice',
    age: 18
})

function print() {
    console.log(`${person.name},${person.age}`)
}

observe(print);
person.name = 'Tom'

const queen = new Set();

const observe = (fn) => {
    queen.add(fn);
}

const observable = function(obj) {
    return new Proxy(obj,{set})

}