为什么80%的码农都做不了架构师?>>>
昨天,我做了 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 之中,会自动执行所有观察者。