未捕获的类型错误：代理设置处理程序为属性“长度”返回 false

Question

我开始测试以下代理模式，并在使用该.splice()方法时收到标题错误。

class A extends Array {
  constructor(...x) {
    super(...x)
    return new Proxy(this, {
      set(o,p,v) {
        console.log("set: ",o,p,v)
        return o[p] = v
      },
            
      get(o,p) {
        console.log("get: ",o,p)
        return o[p]
      },
    })
  }
}

const a = new A(1,2,3)

a.splice(1,0,"a")

产生以下控制台输出：

get:  Array(3) [ 1, 2, 3 ] splice
get:  Array(3) [ 1, 2, 3 ] length
get:  Array(3) [ 1, 2, 3 ] constructor
set:  Array [] length 0

Uncaught TypeError: proxy set handler returned false for property '"length"'
    InnerModuleEvaluation self-hosted:2411
    InnerModuleEvaluation self-hosted:2411
    evaluation self-hosted:2358

有谁知道我缺少哪些内部细节，在使用时需要set返回？true.splice()

Answer 1

这不仅仅是方法，在尝试设置不可写属性时，splice所有严格模式代码都会发生这种情况。陷阱处理程序的错误返回值表明设置属性失败。

"use strict";
const a = new Proxy([1,2,3], {
  set(o,p,v) {
    console.log("set: ",o,p,v)
    return o[p] = v
  },
});
a.length = 0; // TypeError: 'set' on proxy: trap returned falsish for property 'length'

在您的情况下，问题是您返回新的属性值，而陷阱set应该返回 boolean。因此，当您设置 时它“有效” a.length = 5，但对于 则无效a.length = 0。如果您只想记录而不是实际拦截分配，请使用陷阱Reflect对象提供的默认实现来修复此问题，并且不要忘记接收者参数：

const handler = {
  set(o,p,v,r) {
    console.log("set: ",o,p,v)
    return Reflect.set(o,p,v,r);
  },
  get(o,p,r) {
    console.log("get: ",o,p)
    return Reflect.get(o,p,r);
  },
}

class A extends Array {
  constructor(...x) {
    super(...x)
    return new Proxy(this, handler)
  }
}