Javascript 代理的使用

在 ECMAScript 5 (ES5) 中，没有原生的代理（Proxy）功能，这是在 ECMAScript 6 (ES6) 中引入的特性。然而，你可以通过几种不同的方法在 ES5 中模拟代理的行为。
以下是一些在 ES5 中模拟代理行为的方法：

1. 使用 Object.defineProperty()
   你可以使用 Object.defineProperty() 方法来定义或修改对象的属性，并且可以设置 getter 和 setter 来拦截属性的访问和修改。

var target = {
  name: "Alice"
};
Object.defineProperty(target, "name", {
  get: function() {
    console.log("Getting the name property");
    return this._name;
  },
  set: function(newValue) {
    console.log("Setting the name property");
    this._name = newValue;
  }
});
target.name = "Bob"; // 设置时触发 setter
console.log(target.name); // 获取时触发 getter

2. 使用包装对象
   你可以创建一个包装对象，该对象具有与目标对象相同的接口，并在内部代理对目标对象的调用。

var target = {
  name: "Alice",
  greet: function() {
    return "Hello, " + this.name;
  }
};
var proxy = {
  name: target.name,
  greet: function() {
    console.log("Before greeting");
    var result = target.greet.apply(target);
    console.log("After greeting");
    return result;
  }
};
console.log(proxy.greet());

3. 使用函数闭包
   使用闭包可以创建一个私有作用域，在该作用域内可以拦截对目标对象的调用。

var target = {
  name: "Alice",
  greet: function() {
    return "Hello, " + this.name;
  }
};
var proxy = (function(target) {
  return {
    name: target.name,
    greet: function() {
      console.log("Before greeting");
      var result = target.greet.call(target);
      console.log("After greeting");
      return result;
    }
  };
})(target);
console.log(proxy.greet());

在 ECMAScript 2015（ES6）中，Proxy 对象用于定义基本操作的自定义行为（如属性查找、赋值、枚举、函数调用等）。Proxy 用于创建一个对象的代理，从而实现基本操作的自定义（trapping）。
以下是 Proxy 的基本语法：

const p = new Proxy(target, handler);

target: 要包装的目标对象（可以是任何类型的对象，包括原生数组，函数，或者另一个代理）。
handler: 一个定义捕获器（traps）的对象，捕获器可以拦截并定义基本操作的自定义行为。
下面是一个简单的 Proxy 示例，拦截对对象属性的访问：

const target = {
  name: 'Alice'
};
const handler = {
  get: function(target, property, receiver) {
    console.log(`Getting property: ${property}`);
    return target[property];
  },
  set: function(target, property, value) {
    console.log(`Setting property: ${property} to ${value}`);
    target[property] = value;
    return true; // 表示成功
  }
};
const proxy = new Proxy(target, handler);
// 访问属性
console.log(proxy.name); // 输出: Getting property: name Alice
// 设置属性
proxy.name = 'Bob'; // 输出: Setting property: name to Bob
console.log(proxy.name); // 输出: Getting property: name Bob

handler 对象可以包含以下捕获器（traps）：

get(target, propKey, receiver): 拦截对象属性的读取。 set(target, propKey, value,
receiver): 拦截对象属性的设置。 has(target, propKey): 拦截 propKey in proxy
操作，返回一个布尔值。 deleteProperty(target, propKey): 拦截 delete proxy[propKey]
操作，返回一个布尔值。 ownKeys(target): 拦截
Object.getOwnPropertyNames(proxy)、Object.getOwnPropertySymbols(proxy)、Object.keys(proxy)、for…in
循环，返回一个数组。 getOwnPropertyDescriptor(target, propKey): 拦截
Object.getOwnPropertyDescriptor(proxy, propKey)，返回属性的描述对象。
defineProperty(target, propKey, propDesc): 拦截
Object.defineProperty(proxy, propKey, propDesc)，返回一个布尔值。
preventExtensions(target): 拦截 Object.preventExtensions(proxy)，返回一个布尔值。
getPrototypeOf(target): 拦截 Object.getPrototypeOf(proxy)，返回一个对象或 null。
isExtensible(target): 拦截 Object.isExtensible(proxy)，返回一个布尔值。
setPrototypeOf(target, proto): 拦截 Object.setPrototypeOf(proxy,
proto)，返回一个布尔值。 apply(target, thisArg, argArray): 拦截函数的调用、call 和 apply
操作。 construct(target, argArray, newTarget): 拦截 new 操作符，为了使 proxy
能够作为构造函数使用。

Proxy 提供了一种强大的方式来拦截和定义基本操作的自定义行为，这在 ES5 中是不可能轻易实现的。然而，Proxy 的使用需要谨慎，因为它可能会带来一些性能开销，并且如果使用不当，可能会导致代码难以理解和维护。

注意
以上方法都是代理模式的实现，但它们与 ES6 的 Proxy 功能相比有一些局限性：
Object.defineProperty() 只能用于属性，而不是整个对象。
需要为每个属性手动编写代理逻辑。
不能代理所有对象操作，比如枚举、删除属性等。
因此，如果要在 ES5 中实现完整的代理功能，可能需要编写大量的代码，并且可能不如 ES6 的 Proxy 功能强大和灵活。在可能的情况下，升级到支持 ES6 的环境会是更好的选择。

下面是一个代理 Math.floor 方法的例子

window = global;

window.Math = new Proxy(window.Math, {
    get: function (target, prop) {
        console.log(prop, target);
        // 拦截 floor
        if (prop === "floor") {
            return function (x) {
                console.log("floor: ", x);
                return Reflect.apply(target[prop], null, [x]);
            }
        }
        return Reflect.get(target, prop);
    }
});

console.log(window.Math.floor(3.3));