ES6 Proxy & Reflect All In One

ES6 Proxy & Reflect All In One

ES6 Proxy

Proxy;
// ƒ Proxy() { [native code] }


typeof Proxy
// 'function'

ES6 Reflect

Reflect
// Reflect {defineProperty: ƒ, deleteProperty: ƒ, apply: ƒ, construct: ƒ, get: ƒ, …}apply: ƒ apply()construct: ƒ construct()defineProperty: ƒ defineProperty()deleteProperty: ƒ deleteProperty()get: ƒ ()getOwnPropertyDescriptor: ƒ getOwnPropertyDescriptor()getPrototypeOf: ƒ getPrototypeOf()has: ƒ has()isExtensible: ƒ isExtensible()ownKeys: ƒ ownKeys()preventExtensions: ƒ preventExtensions()set: ƒ ()setPrototypeOf: ƒ setPrototypeOf()Symbol(Symbol.toStringTag): "Reflect"[[Prototype]]: Object

typeof Reflect
// 'object'

demos

Proxy

const target = {
  message1: "hello",
  message2: "everyone"
};

const handler2 = {
  get: function(target, prop, receiver) {
    return "world";
  }
};

const proxy2 = new Proxy(target, handler2);

console.log(proxy2.message1);
// world
console.log(proxy2.message2);
// world

const target = {
  message1: "hello",
  message2: "everyone"
};

const handler3 = {
  get: function (target, prop, receiver) {
    if (prop === "message2") {
      return "world";
    }
    return Reflect.get(...arguments);
  },
};

const proxy3 = new Proxy(target, handler3);

console.log(proxy3.message1);
// hello
console.log(proxy3.message2);
// world

Reflect

// detecting whether an object contains certain properties

const duck = {
  name: 'Maurice',
  color: 'white',
  greeting: function() {
    console.log(`Quaaaack! My name is ${this.name}`);
  }
}

Reflect.has(duck, 'color');
// true
Reflect.has(duck, 'haircut');
// false

refs

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect

---

---

©xgqfrms 2012-2020

www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

---