JavaScript 使用 Proxy 控制和隐藏目标对象的属性

JavaScript 使用 Proxy 对象可以很容易地控制和隐藏目标对象的属性。通过在Proxy的处理器对象中重写has和get方法实现来达到这一目的。可以参考以下代码：

// 定义一个包含需要隐藏属性名的数组
const hiddenProperties = ['foo', 'bar']; 

// 创建一个目标对象，包含 foo、bar 和 baz 属性
const targetObject = { 
  foo: 1, 
  bar: 2, 
  baz: 3 
}; 

// 使用 Proxy 创建一个代理对象 proxy
const proxy = new Proxy(targetObject, { 
  // 拦截对对象属性的获取操作
  get(target, property) { 
    // 如果请求的属性在 hiddenProperties 数组中，返回 undefined
    if (hiddenProperties.includes(property)) { 
      return undefined; 
    } else { 
      // 否则，使用 Reflect.get 获取属性值
      return Reflect.get(...arguments); 
    } 
  }, 
  // 拦截对象属性的 in 操作符
  has(target, property) { 
    // 如果属性在 hiddenProperties 数组中，返回 false
    if (hiddenProperties.includes(property)) { 
      return false; 
    } else { 
      // 否则，使用 Reflect.has 判断属性是否存在
      return Reflect.has(...arguments); 
    } 
  } 
}); 

// 测试 get() 拦截器
console.log(proxy.foo); // undefined，foo 属性被隐藏
console.log(proxy.bar); // undefined，bar 属性被隐藏
console.log(proxy.baz); // 3，baz 属性没有被隐藏

// 测试 has() 拦截器
console.log('foo' in proxy); // false，foo 属性被隐藏
console.log('bar' in proxy); // false，bar 属性被隐藏
console.log('baz' in proxy); // true，baz 属性没有被隐藏

相关文章：

本文标签: