《es6标准入门》知识整理(4)- Reflect

为什么80%的码农都做不了架构师?>>>   hot3.png

昨天,我做了 es6 中的新对象 Proxy 的相关的知识整理,现在会整理一下 es6 中另外一个新的内置对象:Reflect。

Reflect 是一个在元编程中使用大量静态方法的全局对象。

跟着我一起来了解一下吧。

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) 是等同的。

除此之外 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() 一样都可以获取对象的原型对象。

比如 defineProperty; es6 中的 Reflect.defineProperty 和 Object.defineProperty 基本等同,用来为对象定义属性:

    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 之中,会自动执行所有观察者。

转载于:https://my.oschina.net/hyzccc/blog/3035790

你可能感兴趣的:(《es6标准入门》知识整理(4)- Reflect)