《es6標準入門》知識整理(4)- Reflect

昨天,我作了 es6 中的新對象 Proxy 的相關的知識整理,如今會整理一下 es6 中另一個新的內置對象:Reflect。javascript

Reflect 是一個在元編程中使用大量靜態方法的全局對象。java

跟着我一塊兒來了解一下吧。es6

Reflect.get() 和 Reflect.set() 能夠操做一個對象的屬性。編程

const Jing = {
    	sex: 'female',
    	age: '22'
    };
    console.log(Reflect.get(Jing, 'sex'));// 'female'
    console.log(Reflect.set(Jing, 'age','21'));
    console.log(Reflect.get(Jing,'age'))// '21'

Reflect 還提供還提供了一種不使用 new,而是用 Refelct.construct 來調用構造函數的方法。如函數

function Employee(name) {
    	this.name = name;
    }
    const huang = new Employee('yuanyuan');
    console.log(huang.name)// yuanyuan
    const zhang = Reflect.construct(Employee, ['zhenzhen']);
    console.log(zhang.name);// zhenzhen

由上述例子可見,new target () 和 Reflcet.construct(target) 是等同的。this

除此以外 Reflect 的方法和一些靜態對象的方法是同樣的,也就是說,從 Reflect 對象上能夠拿到語言內部的方法,好比 getPrototypeOf:代理

function Employee(name) {
    	this.name = name;
    }
    const huang = new Employee('yuanzhen');
    console.log(Object.getPrototypeOf(huang));// Employee
    console.log(Reflect.getPrototypeof(huang));// Employee

可知, Reflect.getPrototypeof() 和 Object.getPrototypeOf() 同樣均可以獲取對象的原型對象。code

好比 defineProperty; es6 中的 Reflect.defineProperty 和 Object.defineProperty 基本等同,用來爲對象定義屬性:server

function myDate() {
    	return false;
    }
    Object.defineProperty(myDate,'now',{
    	value: () => Date.now()
    };
    Refelct.defineProperty(myDate,'now', {
    	value: () => Date.now()
    });
    console.log(Reflect.get(myDate, 'now'));

可是他們之間有一點區別:Object.defineProperty(obj,name,desc) 在沒法定義屬性時,會拋出一個錯誤,而 Reflect.defineProperty(obj,name,desc) 則會返回 false;對象

用Proxy實現觀察者模式

const queueObservers = new Set();
const observe = fn => queueObservers.add(fn);
const observable = obj => new Proxy(obj,{set});
function set(target,key,value,receiver) {
	const result = Reflect.set(target,key,value,receiver)
	queueObservers.forEach(observer => observer());
    return result;
}

思路是 observable 函數返回一個原始對象的 Proxy 代理,攔截賦值操做,觸發充當觀察者的各個函數。

上面代碼中,定義了一個 Set 集合,全部觀察者函數都放進這個集合,而後,observable 函數返回原始對象的代理,攔截賦值操做。攔截函數 set 之中,會自動執行全部觀察者。

相關文章
相關標籤/搜索