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})

}