JavaScript代理模式_拦截器与验证器实现

const user = {
  name: 'Alice',
  age: 25
};
<p>const handler = {
get(target, prop) {
console.log(<code>读取属性: ${prop}</code>);
return target[prop];
},
set(target, prop, value) {
console.log(<code>设置属性: ${prop} = ${value}</code>);
if (prop === 'age' && typeof value !== 'number') {
throw new Error('年龄必须是数字');
}
target[prop] = value;
return true;
}
};</p><p>const proxyUser = new Proxy(user, handler);</p><p><span>立即学习</span>“<a href="https://pan.quark.cn/s/c1c2c2ed740f" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">Java免费学习笔记（深入）</a>”；</p>
                    <div class="aritcle_card">
                        <a class="aritcle_card_img" href="/xiazai/code/8768">
                            <img src="https://img.php.cn/upload/webcode/000/000/005/175664160457344.png" alt="Ex驾校预约小程序">
                        </a>
                        <div class="aritcle_card_info">
                            <a href="/xiazai/code/8768">Ex驾校预约小程序</a>
                            <p>传统驾校预约方式步骤繁琐，效率低下，随着移动互联网科技和5G的革新，驾校考试领域迫切需要更加简洁、高效的预约方式，便捷人们的生活。因此设计基于微信小程序的驾校预约系统，改进传统驾校预约方式，实现高效的驾校学校预约。 采用腾讯提供的小程序云开发解决方案，无须服务器和域名。驾校预约管理：开始/截止时间/人数均可灵活设置，可以自定义客户预约填写的数据项驾校预约凭证：支持线下到场后校验签到/核销/二维码自</p>
                            <div class="">
                                <img src="/static/images/card_xiazai.png" alt="Ex驾校预约小程序">
                                <span>0</span>
                            </div>
                        </div>
                        <a href="/xiazai/code/8768" class="aritcle_card_btn">
                            <span>查看详情</span>
                            <img src="/static/images/cardxiayige-3.png" alt="Ex驾校预约小程序">
                        </a>
                    </div>
                <p>proxyUser.name;        // 输出：读取属性: name
proxyUser.age = 30;    // 输出：设置属性: age = 30</p>

function createValidator(target, validators) {
  return new Proxy(target, {
    set(target, prop, value) {
      if (validators[prop] && !validators[prop](value)) {
        console.error(`${prop} 的值 ${value} 不符合验证规则`);
        return false;
      }
      target[prop] = value;
      return true;
    }
  });
}
<p>const person = {};</p><p>const validatedPerson = createValidator(person, {
email: v => typeof v === 'string' && v.includes('@'),
age: v => typeof v === 'number' && v >= 0 && v <= 150
});</p><p>validatedPerson.email = 'alice@example.com';  // 成功
validatedPerson.age = 25;                     // 成功
validatedPerson.age = -5;                     // 失败，输出错误信息</p>

function createInterceptor(func) {
  return new Proxy(func, {
    apply(target, thisArg, args) {
      console.log(`调用函数 ${target.name}，参数:`, args);
      const start = performance.now();
      const result = target.apply(thisArg, args);
      const end = performance.now();
      console.log(`执行耗时: ${end - start}ms`);
      return result;
    }
  });
}
<p>const calculateSum = createInterceptor(function sum(a, b) {
return a + b;
});</p><p>calculateSum(2, 3);<br />
// 输出：
// 调用函数 sum，参数: [2, 3]
// 执行耗时: 0.1ms</p>