zoukankan      html  css  js  c++  java
  • ES6的Reflect对象

    Reflect对象的方法与Proxy对象的方法一一对应,只要proxy对象上有的方法reflect也能找到。

    ES6将Object对象的一些属于语言内部的方法放到Reflect对象上,从Reflect上能拿到语言内部的方法。如:Object.defineProperty。

    Reflect一共有13个静态方法:

    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)

    Reflect.get(target, name, receiver)

    Reflect.get方法查找并返回target的name属性,如果没有,则返回undefined。如果第一个参数不是对象,则Reflect.get则会报错。

    // Reflect.get(target, name, receiver) 
    
    var myObject = {
      foo: 1
    }
    Reflect.get(myObject, 'foo')   // 1

    如果name属性是读取函数(getter),则读取函数里的this绑定Reflect.get的receiver参数。

    var myObject = {
      foo: 1,
      bar: 2,
      get baz() {
        return this.foo + this.bar;
      },
    };
    
    var myReceiverObject = {
      foo: 4,
      bar: 4,
    };
    
    Reflect.get(myObject, 'baz', myReceiverObject)  // 8

    Reflect.set(target, name, value, receiver)

    Reflect.set方法设置target对象的name属性等于value。

    // Reflect.set(target, name, value, receiver);
    
    var myObject = {
      foo: 1,
      set bar(value) {
        return this.foo = value;
      },
    }
    
    myObject.foo   // 1
    
    Reflect.set(myObject, 'foo', 2);
    myObject.foo    // 2

    如果name参数是一个赋值函数,则赋值函数的this绑定Reflect.set的receiver参数。

    var myObject = {
      foo: 4,
      set bar(value) {
        return this.foo = value;
      },
    };
    
    var myReceiverObject = {
      foo: 0,
    };
    
    Reflect.set(myObject, 'bar', 1, myReceiverObject);
    myObject.foo // 4
    myReceiverObject.foo // 1

    Reflect.has(obj, name)

    Reflect.has对应 name in obj 里面的in操作,如果第一个参数不是对象,Reflect.has和in都会报错。

    var myObject = {
      foo: 1,
    };
    
    // 旧写法
    'foo' in myObject    // true
    
    // 新写法
    Reflect.has(myObject, 'foo')    // true

    Reflect.deleteProperty(obj, name)

    Reflect.deleteProperty方法等同于delete obj[name],用于删除对象属性。该方法返回一个布尔值。如果删除成功或删除的属性不存在,则返回true,如果删除失败,删除的属性依然还在,则返回false。

    const myObj = { foo: 'bar' };
    
    // 旧写法
    delete myObj.foo;
    
    // 新写法
    Reflect.deleteProperty(myObj, 'foo');

    Reflect.construct(target, args)

    Reflect.construct方法等同于new target(...args),这提供了一种不使用new,来调用构造函数的方法。

    function Greeting(name) {
      this.name = name;
    }
    
    // new 的写法
    const instance = new Greeting('张三');
    
    // Reflect.construct 的写法
    const instance = Reflect.construct(Greeting, ['张三']);

    Reflect.getPrototypeOf(obj)

    Reflect.getPrototypeOf方法用读取对象的__proto__属性,对应Object.getPrototypeOf(obj)方法。它们的区别是,如果参数不是对象,Object.getPrototypeOf会将参数转化为对象,而Reflect.getPrototypeOf会报错。

    const myObj = new FancyThing();
    
    // 旧写法
    Object.getPrototypeOf(myObj) === FancyThing.prototype;
    
    // 新写法
    Reflect.getPrototypeOf(myObj) === FancyThing.prototype;

    Reflect.setPrototypeOf(obj, newProto)

    Reflect.setPrototypeOf方法是设置对象的__proto__属性,返回第一个参数对象,对应Object.setPrototypeOf(obj, newProto)。如果第一个参数不是对象,Object.setPrototypeOf会返回第一个参数对象,而Reflect.setPrototypeOf会报错。如果第一个参数是undefined或null,则两个都会报错。

    const myObj = new FancyThing();
    
    // 旧写法
    Object.setPrototypeOf(myObj, OtherThing.prototype);
    
    // 新写法
    Reflect.setPrototypeOf(myObj, OtherThing.prototype);

    Reflect.apply(func, thisArgs, args)

    Reflect.apply相当于fn.apply

    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, []);

    Reflect.defineProperty(target, propertyKey, attributes)

    Reflect.defineProperty等同于Object.defineProperty,用来为对象定义属性。未来后者会被逐渐废除。如果第一个参数不是对象,就会抛出错误信息。

    function MyDate() {
      /**/
    }
    
    // 旧写法
    Object.defineProperty(MyDate, 'now', {
      value: () => Date.now()
    });
    
    // 新写法
    Reflect.defineProperty(MyDate, 'now', {
      value: () => Date.now()
    });

    Reflect.getOwnPropertyDescriptor(target, propertyKey) 

    Reflect.getOwnPropertyDescriptor方法等同于Object.getOwnPropertyDescriptor,用于得到指定属性的描述对象,将来会代替后者。如果第一个参数不是对象Object.getOwnPropertyDescriptor不报错,返回undefined,而Reflect.getOwnPropertyDescriptor会报错,表示参数非法。

    var myObject = {};
    Object.defineProperty(myObject, 'hidden', {
      value: true,
      enumerable: false,
    });
    
    // 旧写法
    var theDescriptor = Object.getOwnPropertyDescriptor(myObject, 'hidden');
    
    // 新写法
    var theDescriptor = Reflect.getOwnPropertyDescriptor(myObject, 'hidden');

    Reflect.isExtensible (target) 

    Reflect.isExtensible等同于Object.isExtensible,返回一个布尔值,表示当前对象是否可扩展。如果参数不是对象,Object.isExtensible会返回false,因为本来就是不可扩展的,而Reflect.isExtensible则报错。

    const myObject = {};
    
    // 旧写法
    Object.isExtensible(myObject) // true
    
    // 新写法
    Reflect.isExtensible(myObject) // true

    Reflect.preventExtensions(target)

    Reflect.preventExtensions等同于Object.preventExtensions,用于让一个对象变为不可扩展,返回一个布尔值,表示是否操作成功。如果参数不是对象,Object.preventExtensions在ES5下会报错,ES6下会返回传入的值,Reflect.preventExtensions则会报错。

    var myObject = {};
    
    // 旧写法
    Object.preventExtensions(myObject) // Object {}
    
    // 新写法
    Reflect.preventExtensions(myObject) // true

    Reflect.ownKeys (target)

    Reflect.ownKeys方法用于返回对象的所有属性,等同于Object.getOwnPropertyNames与Object.getOwnPropertySymbols之和。

    var myObject = {
      foo: 1,
      bar: 2,
      [Symbol.for('baz')]: 3,
      [Symbol.for('bing')]: 4,
    };
    
    // 旧写法
    Object.getOwnPropertyNames(myObject)
    // ['foo', 'bar']
    
    Object.getOwnPropertySymbols(myObject)
    //[Symbol(baz), Symbol(bing)]
    
    // 新写法
    Reflect.ownKeys(myObject)
    // ['foo', 'bar', Symbol(baz), Symbol(bing)]

    原文:

    https://www.cnblogs.com/kdcg/p/9139273.html

  • 相关阅读:
    <2016-1-28>
    <页面里折合与打开>
    右上角鼠标滑过展开收缩动画效果js代码的演示页面
    30款css3实现的鼠标经过图片显示描述特效
    dede让channelartlist标签支持currentstyle属性 完美解决
    织梦导航 currentstyle 点击li添加class类 样式
    论坛首页显示板块,但没有权限点不进去
    医疗窗口右下角弹出抖动效果
    joomla搬家之后打不开 首页404错误
    Discuz X3游客看小图功能导致文字内容隐藏的【修复方法】
  • 原文地址:https://www.cnblogs.com/xjy20170907/p/11557876.html
Copyright © 2011-2022 走看看