简介
ES6 引入了 Proxy 和 Reflect，可以通过代理操作目标对象中的属性或方法。使用 Proxy 可以更方便地实现一些面向对象编程的高级特性，比如观察者模式、迭代器模式等。本文将详细介绍 Proxy 和 Reflect 的用法及其作用。
Proxy 的用法
Proxy 是 ES6 新增的一个构造函数，用来创建代理对象。它接收两个参数：target 和 handler。target 是需要被代理的原始对象，handler 是一个对象，其中定义了代理对象的各种行为。
直接读取属性值
Proxy 可以直接访问 target 对象的属性值，并在此过程中进行拦截和修改。例如：
-- -------------------- ---- -------
----- ------ - -
----- ------
---- --
--
----- ------- - -
---- ---------------- ----- --------- -
-------------------- ----------
------ -------------
-
--
----- ----- - --- ------------- ---------
------------------------ -- -- -------- ----- - -----
----------------------- -- -- -------- ---- - --在上面的代码中，我们定义了一个代理对象 proxy。handler 中的 get 方法会在直接读取代理对象上的属性时被触发，在该方法中可以对读取值的过程进行干预。
直接设置属性值
Proxy 还可以直接设置 target 对象的属性值，也可以通过 set 方法对此行为进行干预。例如：
-- -------------------- ---- -------
----- ------ - -
----- ------
---- --
--
----- ------- - -
---- ---------------- ----- ------ --------- -
-------------------- ------- ---- ----- -----------
------------ - ------
------ -----
-
--
----- ----- - --- ------------- ---------
--------- - --- -- -- -------- --- ---- ----- ---
----------------------- -- -- --在上面的代码中，我们定义了一个 set 方法，在设置代理对象某个属性值时就会被调用。其中，target[prop] = value 语句实现了直接修改 target 的属性值。
拦截方法调用
Proxy 还可以拦截目标对象上的方法调用，比如：
-- -------------------- ---- -------
----- ------ - -
----- ------
--------- ---------- -
---------------------
-
--
----- ------- - -
------ ---------------- -------- ----- -
-------------------- -------- - - -------------
------------------
-
--
----- ----- - --- ------------- ---------
----------------- -- -- -------- -------- ---- - -------在上述代码中，我们定义了在调用 sayHello 方法时触发的 apply 方法，可以在该方法中执行方法的拦截和调整逻辑。
Reflect 的使用
Reflect 是 ES6 引入的一个全局变量，提供许多与 Proxy 相关的底层方法。这些方法包括读写操作、函数调用、对象实例化等。
对象属性读取
通过 Reflect.get() 方法可以读取指定属性的值：
const obj = { foo: "bar" };
console.log(Reflect.get(obj, "foo")); // 输出 "bar"直接设置对象属性值
Reflect.set() 用于直接设置一个对象的属性值:
const obj = { foo: "bar" };
Reflect.set(obj, "foo", "baz");
console.log(obj.foo); // 输出 "baz"判断对象中是否包含指定属性
使用 Reflect.has() 来判断一个对象中是否包含某个属性：
const obj = { foo: "bar" };
console.log(Reflect.has(obj, "foo")); // 输出 true
console.log(Reflect.has(obj, "baz")); // 输出 false总结
本文介绍了 ES6 中 Proxy 和 Reflect 的用法及其作用。通过上述的代码示例，我们可以看
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/651a925195b1f8cacd27602c