覆盖localStorage的点表示法

Question

我正在尝试覆盖访问localStorage的点表示法。 我已经按照此处描述的方式成功地覆盖了getItem和setItem方法：在HTML5中是否可以分别覆盖本地存储和会话存储？ 现在我尝试创建一个代理来捕获点访问，但由于我似乎无法像这里尝试的那样覆盖localStorage对象，所以失败了。

localStorage  = new Proxy(localStorage, {
get: function(target, name) {
    if (!(name in target)) {
        console.log("Getting non-existent property '" + name + "'");
        return undefined;
    }
    return '123';
},
set: function(target, name, value) {
    if (!(name in target)) {
        console.log("Setting non-existent property '" + name + "', initial value: " + value);
    }
    target[name] = value;
}
});

现在当我尝试时，仍然会得到测试而不是123：

localStorage.testKey = "test";
alert(localStorage.testKey)

- Display name

---

代理对象不能与其虚拟化的对象具有相同的名称。实际上，您的 get / set 方法尚未被调用。尝试在每个方法中添加 console.log 调用（在 if 之外），您将看到结果。 - hindmost

我知道我的方法没有被调用，问题是是否有任何方法可以让它们被调用。 - Display name

是否有任何方法可以调用它们。请使用不同的名称/标识符来代替代理对象（除了“localStorage”）。 - hindmost

Answer 1

如果您在localStorage上定义getter，它应该可以工作：

Object.defineProperty(window, "localStorage", new (function () {
    this.get = function() {
      console.log("I'm getting called");
    }
})());

- Elvio Cavalcante

Answer 2

window.localStorage 是一个只读属性，所以你不能像那样重新赋值。

(我建议打开严格模式，这将通过抛出异常来提醒您此事实。)

然而，它是可配置的。如果您先从window对象中删除它，您的代码将按预期工作。

var lsProxy = new Proxy(localStorage, {
    /* insert descriptor here */
});

delete window.localStorage;
window.localStorage = lsProxy;

您也可以使用Object.defineProperty重新定义它。

Object.defineProperty(window, "localStorage", {
    value: lsProxy,
    configurable: true,
    enumerable: true,
    writable: false
}); 

- a cat