小编TCo*_*ert的帖子

正确构建数组的Javascript代理集处理程序

为数组构建Javascript代理的正确方法是什么,以便对单个更改数组不会多次调用"set"处理程序?

这就是我的意思:

我想在Proxy对象中包装一个简单的数组.我希望在我希望将一个新值推送到此Proxy对象时运行'set'处理程序.

麻烦的是,代理处理程序像"设置"被调用多次一个操作为数组.在某些情况下,处理问题似乎相当容易,但在其他情况下,修改包含在Proxy对象中的数组的一次调用会使每个元素至少调用一次set处理程序.

假设我创建了最简单的代理处理程序对象和代理,如下所示:

let proxyHandlerObj = {
  set:function(target,property,value,receiver) {
    console.log("Set handler is invoked on property:",property,"with value:",value);
    /*
     * Important and interesting things done here
     */
    return (target[property] = value);
  }
};

let proxyArray = new Proxy(["zero","one","two"],proxyHandlerObj);
Run Code Online (Sandbox Code Playgroud)

这个代理只是拦截对我的代理数组的'set-like'调用并向控制台写一条消息.现在,当我在proxyArray对象的末尾添加一个新元素时:

proxyArray.push("three")

我会得到这样的东西:

Set handler is invoked on property: 3 with value: three
Set handler is invoked on property: length with value: 4
Run Code Online (Sandbox Code Playgroud)

我看到set处理程序被调用了两次:一次用于在数组中创建一个新元素,另一次用于设置数组的新长度属性.

好的,可以通过检查被操作的属性来处理此问题.我已经看到设置属性完成了这样的事情:

set:function(target,property,value,receiver) {
  if(property!="length") {
    console.log("Set …
Run Code Online (Sandbox Code Playgroud)

javascript arrays proxy

7
推荐指数
1
解决办法
779
查看次数

标签 统计

arrays ×1

javascript ×1

proxy ×1