时间戳

首页 > 解决方案 > 使用 javascript globalThis 进行状态管理

javascript - 使用 javascript globalThis 进行状态管理

问题描述

这似乎是一个疯狂的想法，但如果我使用 globalThis 来存储我的浏览器唯一 SPA 的全局状态会有什么问题。

我在想这样的事情

globalThis.state = {...initialStateData}; // attach a property to globalThis and initialize
//later in any component, mutate the value
globalThis.state.counter = 45;
//yet in some other area, access and display the value
console.log(globalThis.state.counter);

这可以通过在混合中引入代理并创建类似于轻量级 redux 的东西来进一步实现。

我在 chrome 中对此进行了测试，它可以工作（我的意思是 chrome 不反对我将我的数据附加到 globalThis）。

我的问题是，这是一个疯狂的想法，不应该在生产应用程序中使用，因为我可能在无知中违反了一些标准？

或者，globalThis 的行为会随着时间而改变，浏览器不允许用户附加属性到这个特定的对象？

编辑：这个问题是关于纯香草 JS 而不是关于 redux 或反应甚至打字稿。

如何在 Deno 中定义全局变量？将是与当前查询最接近的匹配项

标签： javascriptglobal-variables

解决方案

修改浏览器globalThis的对象或window对象是非常规的，它会产生一些难以调试或修复的问题。这也是一种对象污染& eslint/jshint 也会抱怨& typescript 会抛出编译时间错误..不要在生产中这样做，因为从长远来看它会非常糟糕..其中之一是属性名称冲突并且会出现很多问题。我不知道其中的每一个，但您可以轻松阅读一些关于这种行为的中型书籍/文章。这也是为什么现代 npm 包不接触这些对象的原因，因为globalThis不允许modules......尝试使用globalThis/window作为read-only对象.. 不要改变它的道具..

希望你明白我说的..

推荐阅读