ES6 中的 Proxy 概述

Proxy 是 JavaScript ES6 引入的一种新特性，它可以用来创建一个对象的代理，从而控制对该对象的访问、操作和行为。Proxy 可以拦截并自定义对象的各种操作，如读取属性、写入属性、函数调用等。它为 JavaScript 提供了一种强大的机制，允许你在对象操作上添加额外的行为。

Proxy 的基本语法

const proxy = new Proxy(target, handler);

• target：目标对象，Proxy 会拦截并代理这个对象。
• handler：一个对象，包含一系列用于拦截目标对象行为的函数。

常用的 Handler 方法

handler 对象中包含一组预定义的陷阱（traps），用于拦截不同的操作。常见的陷阱有：

• get：拦截属性的读取操作。
• set：拦截属性的设置操作。
• has：拦截 in 操作符的检查。
• deleteProperty：拦截 delete 操作符。
• apply：拦截函数调用。
• construct：拦截构造函数的调用。

基本用法

1. get 操作拦截

通过 get 捕获对象属性的读取。

const target = {
   
  message: 'Hello, World!'
};

const handler = {
   
  get(target, prop, receiver) {
   
    if (prop === 'message') {
   
      return `${
     target[prop]} (from Proxy)`;
    }
    return prop in target ? target[prop] : 'Property not found';
  }
};

const proxy = new Proxy(target, handler);

console.log(proxy.message); // "Hello, World! (from Proxy)"
console.log(proxy.nonExistent); // "Property not found"

2. set 操作拦截

通过 set 捕获属性的设置操作。

const target = {
   
  age: 30
};

const handler = {
   
  set(target, prop, value, receiver) {
   
    if (prop === 'age' && value < 0) {
   
      console.log('Age cannot be negative!');
      return false; // 阻止设置负值
    }
    target[prop] = value;
    return true;
  }
};

const proxy = new Proxy(target, handler);

proxy.age = -5; // "Age cannot be negative!"
proxy.age = 35; // 正常设置
console.log(proxy.age); // 35

3. apply 操作拦截

通过 apply 可以拦截函数调用。

const target