ES6 |Reflect

在这里插入图片描述

设计目的

  1. Object对象的一些明显属于语言内部的方法(比如Object.defineProperty),放到Reflect对象上。然后就可以从Reflect对象上可以拿到语言内部的方法

  2. 修改某些Object方法的返回结果,让其变得更合理。比如,Object.defineProperty(obj, name, desc)在无法定义属性时,会抛出一个错误,而Reflect.defineProperty(obj, name, desc)则会返回false

    // 老写法
    try {
      Object.defineProperty(target, property, attributes);
      // success
    } catch (e) {
      // failure
    }
    
    // 新写法
    if (Reflect.defineProperty(target, property, attributes)) {
      // success
    } else {
      // failure
    }
    
  3. Object操作都变成函数行为。某些Object操作是命令式,比如name in objdelete obj[name],而Reflect.has(obj, name)Reflect.deleteProperty(obj, name)让它们变成了函数行为

    // 老写法
    'assign' in Object // true
    
    // 新写法
    Reflect.has(Object, 'assign') // true
    
  4. Reflect对象的方法与Proxy对象的方法一一对应,只要是Proxy对象的方法,就能在Reflect对象上找到对应的方法。这就让Proxy对象可以方便地调用对应的Reflect方法,完成默认行为。也就是说,不管Proxy怎么修改默认行为,你总可以在Reflect上获取默认行为。

    Proxy(target, {
      set: function(target, name, value, receiver) {
        var success = Reflect.set(target,name, value, receiver);
        if (success) {
          log('property ' + name + ' on ' + target + ' set to ' + value);
        }
        return success;
      }
    });
    //它采用Reflect.set方法将值赋值给对象的属性,确保完成原有的行为,然后再部署额外的功能
    //每一个Proxy对象的拦截操作,内部都调用对应的Reflect方法,保证原生行为能够正常执行
    
  5. 有了Reflect对象以后,很多操作会更易读

    // 老写法
    Function.prototype.apply.call(Math.floor, undefined, [1.75]) // 1
    
    // 新写法
    Reflect.apply(Math.floor, undefined, [1.75]) // 1
    

静态方法

  • Reflect.apply(target,thisArg,args)
  • Reflect.construct(target,args)
  • Reflect.get(target,name,receiver)
  • Reflect.set(target,name,value,receiver)
  • Reflect.defineProperty(target,name,desc)
  • Reflect.deleteProperty(target,name)
  • Reflect.has(target,name)
  • Reflect.ownKeys(target)
  • Reflect.isExtensible(target)
  • Reflect.preventExtensions(target)
  • Reflect.getOwnPropertyDescriptor(target, name)
  • Reflect.getPrototypeOf(target)
  • Reflect.setPrototypeOf(target, prototype)
  1. Reflect.apply(func, thisArg, args):等同于Function.prototype.apply.call(func, thisArg, args),用于绑定this对象后执行给定函数

    const ages = [11, 33, 12, 54, 18, 96];
    
    // 旧写法
    const youngest = Math.min.apply(Math, ages);
    const oldest = Math.max.apply(Math, ages);
    const type = Object.prototype.toString.call(youngest);
    
    // 新写法
    const youngest = Reflect.apply(Math.min, Math, ages);
    const oldest = Reflect.apply(Math.max, Math, ages);
    const type = Reflect.apply(Object.prototype.toString, youngest, []);
    
  2. Reflect.construct(target, args):调用构造函数的方法

    function Greeting(name) {
      this.name = name;
    }
    
    // new 的写法
    const instance = new Greeting('张三');
    
    // Reflect.construct 的写法
    const instance = Reflect.construct(Greeting, ['张三']);
    
  3. Reflect.get(target, name, receiver):查找并返回target对象的name属性,如果没有该属性,则返回undefined

    var myObject = {
      foo: 1,
      bar: 2,
      get baz() {
        return this.foo + this.bar;
      },
    }
    
    Reflect.get(myObject, 'foo') // 1
    Reflect.get(myObject, 'bar') // 2
    Reflect.get(myObject, 'baz') // 3
    
    //如果name属性部署了读取函数(getter),则读取函数的this绑定receiver
    var myReceiverObject = {
      foo: 4,
      bar: 4,
    };
    
    Reflect.get(myObject, 'baz', myReceiverObject) // 8
    
  4. Reflect.set(target, name, value, receiver):设置target对象的name属性等于value

    var myObject = {
      foo: 1,
      set bar(value) {
        return this.foo = value;
      },
    }
    
    myObject.foo // 1
    Reflect.set(myObject, 'foo', 2);
    myObject.foo // 2
    Reflect.set(myObject, 'bar', 3)
    myObject.foo // 3
    
    //如果name属性设置了赋值函数,则赋值函数的this绑定receiver
    var myReceiverObject = {
      foo: 0,
    };
    Reflect.set(myObject, 'bar', 4, myReceiverObject);
    myObject.foo // 1
    myReceiverObject.foo // 4
    
    //Reflect.set会触发Proxy.defineProperty拦截
    
  5. Reflect.defineProperty(target, propertyKey, attributes):基本等同于Object.defineProperty,用来为对象定义属性

    function MyDate() {/*…*/}
    
    // 旧写法
    Object.defineProperty(MyDate, 'now', {
      value: () => new Date.now()
    });
    
    // 新写法
    Reflect.defineProperty(MyDate, 'now', {
      value: () => new Date.now()
    });
    
  6. Reflect.deleteProperty(obj, name):等同于delete obj[name],用于删除对象的属性

    const myObj = { foo: 'bar' };
    
    // 旧写法
    delete myObj.foo;
    
    // 新写法
    Reflect.deleteProperty(myObj, 'foo');
    //返回一个布尔值。如果删除成功,或者被删除的属性不存在,返回true;删除失败,被删除的属性依然存在,返回false
    
  7. Reflect.has(obj, name):对应name in obj里面的in运算符

    var myObject = {
      foo: 1,
    };
    
    // 旧写法
    'foo' in myObject // true
    
    // 新写法
    Reflect.has(myObject, 'foo') // true
    
  8. Reflect.ownKeys (target):返回对象的所有属性,基本等同于Object.getOwnPropertyNamesObject.getOwnPropertySymbols之和

    var myObject = {
      foo: 1,
      bar: 2,
      [Symbol.for('baz')]: 3,
      [Symbol.for('bing')]: 4,
    };
    
    // 旧写法
    Object.getOwnPropertyNames(myObject)
    // ['foo', 'bar']
    
    Object.getOwnPropertySymbols(myObject)
    //[Symbol.for('baz'), Symbol.for('bing')]
    
    // 新写法
    Reflect.ownKeys(myObject)
    // ['foo', 'bar', Symbol.for('baz'), Symbol.for('bing')]
    
  9. Reflect.isExtensible (target):对应Object.isExtensible,返回一个布尔值,表示当前对象是否可扩展

    const myObject = {};
    
    // 旧写法
    Object.isExtensible(myObject) // true
    
    // 新写法
    Reflect.isExtensible(myObject) // true
    
  10. Reflect.preventExtensions(target):对应Object.preventExtensions方法,用于让一个对象变为不可扩展。它返回一个布尔值,表示是否操作成功

    var myObject = {};
    
    // 旧写法
    Object.isExtensible(myObject) // true
    
    // 新写法
    Reflect.preventExtensions(myObject) // true
    
  11. Reflect.getOwnPropertyDescriptor(target, propertyKey):基本等同于Object.getOwnPropertyDescriptor,用于得到指定属性的描述对象

    var myObject = {};
    Object.defineProperty(myObject, 'hidden', {
      value: true,
      enumerable: false,
    });
    
    // 旧写法
    var theDescriptor = Object.getOwnPropertyDescriptor(myObject, 'hidden');
    
    // 新写法
    var theDescriptor = Reflect.getOwnPropertyDescriptor(myObject, 'hidden');
    
  12. Reflect.getPrototypeOf(obj):读取对象的__proto__属性,对应Object.getPrototypeOf(obj)

    const myObj = new FancyThing();
    
    // 旧写法
    Object.getPrototypeOf(myObj) === FancyThing.prototype;
    
    // 新写法
    Reflect.getPrototypeOf(myObj) === FancyThing.prototype;
    
  13. Reflect.setPrototypeOf(obj,newProto):设置对象的__proto__属性,返回第一个参数对象。对应Object.setPrototypeOf(obj, newProto)

    const myObj = new FancyThing();
    
    // 旧写法
    Object.setPrototypeOf(myObj, OtherThing.prototype);
    // 新写法
    Reflect.setPrototypeOf(myObj, OtherThing.prototype);
    
posted @ 2020-09-01 13:46  sanhuamao  阅读(97)  评论(0编辑  收藏  举报