06-3 (付費) 物件攔截：Proxy 與 Reflect

1. Proxy (代理人)

Proxy 可以讓我們攔截物件的各種操作（讀取 get、賦值 set、刪除 deleteProperty 等）。

const target = { price: 100 };

const observer = new Proxy(target, {
  set(obj, prop, value) {
    if (prop === "price" && value < 0) {
      throw new Error("價格不能是負數！");
    }
    console.log(`屬性 ${prop} 已更新為 ${value}`);
    obj[prop] = value;
    return true;
  }
});

observer.price = 200; // ✅ 更新成功
observer.price = -50; // ❌ 報錯

2. Reflect (反射)

Reflect 是一個內建對象，它提供了攔截 JavaScript 操作的方法。 它通常與 Proxy 搭配使用，用來執行「原本該有的行為」。

const handler = {
  get(target, prop, receiver) {
    console.log(`正在讀取: ${prop}`);
    return Reflect.get(target, prop, receiver); // 確保 this 指向正確
  }
};

3. 實戰場景：自動化驗證與記錄 (Validation)

在 2026 年，我們常利用 Proxy 來建立自動驗證的 Model。

function createValidator(data, schema) {
  return new Proxy(data, {
    set(target, prop, value) {
      const validator = schema[prop];
      if (validator && !validator(value)) {
        console.error(`${prop} 驗證失敗！`);
        return false;
      }
      return Reflect.set(target, prop, value);
    }
  });
}