使用JavaScript的Proxy监听对象属性变化并进行类public/private的访问控制

监听属性变化

Proxy最简单的用法是可以监听对象属性的变化，比如下面的，当 obj 的 visit 属性改变时，自动更新页面上相应的 input元素值。

var obj = {}
var handler = {
set: function(target, name, value) {    
//改变被代理对象的值，使之保持一致
target[name] = value
var input = document.querySelector(‘[name=’ + name + ‘]’)
if (input) {
input.value = value
}
}
}
var proxy = new Proxy(obj, handler);
proxy.visit = 100
setInterval(function() {
proxy.visit++
}, 1000)

Proxy还可以用来检查设置的值是否规范：

var obj = {}

var handler = {
  set: function(target, name, value) {    
    if (isNaN(Number(value))) {
      throw 'Type error'
    }

    target[name] = value
  }
}

var proxy = new Proxy(obj, handler);

执行结果：

proxy.visit = 'OurJS'
> Uncaught Type error

proxy.visit = 100
> 100

用Proxy实现private/ public