javascript - Chrome 86 : TypeError: Accessor properties are not allowed

Question

我定义了一个属性访问器，它曾经在 Chrome 版本 86.0.4240.80(官方构建)(x86_64) 更新之前工作。

const newSetItem = (x, y) => {
    sessionStorage.setItem(`custom_${x}`, y)
}

Object.defineProperty(localStorage, 'setItem', {get: newSetItem, configurable: true, writeable: true})

此外，这目前在 Firefox 和 Edge 以及 Chrome 85 中运行良好。

现在它抛出:

TypeError: Accessor properties are not allowed.

这是最新 Chrome 版本的一项功能还是有什么问题？

Answer 1

您正在尝试将主机提供的奇异对象 (localStorage) 的标准方法 (setItem) 转换为访问器属性设置方法。即使它奏效了，这也将是一个非常糟糕的主意。 (另请注意，setter 方法仅接受一个单个 参数，而不是两个。)

如果您的目标是在 localStorage 中设置一些东西，而在 sessionStorage 中设置它，最简单的方法是制作 localStorage 全局指向 sessionStorage。你不能分配给它(它是只读的)，但你可以重新配置它:

Object.defineProperty(window, "localStorage", {
    value: sessionStorage,
    configurable: true
});

(简单地 let localStorage = sessionStorage; 也可以，如果你能确定没有任何代码使用 window.localStorage.setItem(...) 而不仅仅是 localStorage.setItem(...) 但您可能无法做出这样的假设。)

不过，我不建议这样做。我会尽我所能改变写入 localStorage 的要求，改为写入 sessionStorage。但如果你做不到，那就是你要做的。

如果您不想让它们那样等价，那么您必须做同样的事情来用 Proxy 对象替换 localStorage。它必须是代理的原因是 localStorage 和 sessionStorage 不仅通过 setItem 和 getItem< 提供对项目的访问，它们还提供命名访问作为属性(例如，localStorage.foo = "bar";)。在 JavaScript 中模拟通配符访问器属性的唯一方法是使用 Proxy 对象，该对象为 get 和 set/defineProperty 陷阱提供处理程序。