使用 javascript globalThis 进行状态管理
using javascript globalThis for state management
这似乎是个疯狂的想法，但如果我使用 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 的行为会随着时间的推移而改变，浏览器将不允许用户附加属性到这个特定对象？
编辑：这个问题是关于纯 vanilla JS 的，而不是关于 redux 或 react 甚至 typescript 的。
将是与当前查询最接近的匹配项
修改浏览器的 globalThis 或 window 对象是非常规的，它会产生一些难以调试或修复的问题。这也是一种object pollution & eslint/jshint 也会抱怨 & typescript 会抛出编译时错误。不要在生产中这样做，因为它在长时间 运行 中会非常糟糕。其中之一是 名称冲突属性 & 会出现很多问题。我不认识他们中的每一个，但你可以轻松地阅读一些关于这种行为的媒体books/articles。这也是为什么现代 npm 包不接触这些对象，因为 globalThis 不允许 modules 的想法...尝试使用 globalThis/window 作为 read-only 对象.. 不要改变它的道具..
希望你明白我说的..
一般不建议修改globalThis（或window），原因如下：
- 与第 3 方代码的命名冲突：如果另一个脚本也修改了 globalThis 并选择了相同的名称，那么您就有麻烦了，尽管这更多地适用于库而不是主页的逻辑。
- 与 Javascript 的命名冲突：新的内置 javascript 实用程序往往会添加到全局对象中 - 如果它们曾经添加过与您使用的名称相同，它会在您的页面以及您使用的任何期望该实用程序存在的库中引起问题。 不过，只要你的名字足够独特，这真的不是什么大问题。
- 版本控制：如果您正在开发一个库，不幸的是，在某些情况下您可能会同时加载同一个库的多个版本。如果他们使用全局状态，这是不可能的。同样，这并不适用于使用，因为您没有开发库。
- 可追溯性：很难知道是什么设置了全局状态，又是什么修改了它。
因此，老实说，您可以使用全局状态并避免面临任何这些负面后果。我不想仅仅因为这是推荐的建议就告诉您不要使用它。事实上，在过去，网站将所有数据和模块放入一个巨大的全球层次结构中更为常见。 但是，出于另一个原因，我仍然建议避免全局状态 - 存在一个不那么神奇的更好的解决方案。 Javascript 现在有一个标准的模块系统，可以用来代替全局状态。只需创建一个模块来保存您的应用程序具有的任何共享状态。
这似乎是个疯狂的想法，但如果我使用 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 的行为会随着时间的推移而改变，浏览器将不允许用户附加属性到这个特定对象？
编辑：这个问题是关于纯 vanilla JS 的，而不是关于 redux 或 react 甚至 typescript 的。
修改浏览器的 globalThis 或 window 对象是非常规的，它会产生一些难以调试或修复的问题。这也是一种object pollution & eslint/jshint 也会抱怨 & typescript 会抛出编译时错误。不要在生产中这样做，因为它在长时间 运行 中会非常糟糕。其中之一是 名称冲突属性 & 会出现很多问题。我不认识他们中的每一个，但你可以轻松地阅读一些关于这种行为的媒体books/articles。这也是为什么现代 npm 包不接触这些对象，因为 globalThis 不允许 modules 的想法...尝试使用 globalThis/window 作为 read-only 对象.. 不要改变它的道具..
希望你明白我说的..
一般不建议修改globalThis（或window），原因如下：
- 与第 3 方代码的命名冲突：如果另一个脚本也修改了 globalThis 并选择了相同的名称，那么您就有麻烦了，尽管这更多地适用于库而不是主页的逻辑。
- 与 Javascript 的命名冲突：新的内置 javascript 实用程序往往会添加到全局对象中 - 如果它们曾经添加过与您使用的名称相同，它会在您的页面以及您使用的任何期望该实用程序存在的库中引起问题。 不过，只要你的名字足够独特，这真的不是什么大问题。
- 版本控制：如果您正在开发一个库，不幸的是，在某些情况下您可能会同时加载同一个库的多个版本。如果他们使用全局状态，这是不可能的。同样，这并不适用于使用，因为您没有开发库。
- 可追溯性：很难知道是什么设置了全局状态，又是什么修改了它。
因此，老实说，您可以使用全局状态并避免面临任何这些负面后果。我不想仅仅因为这是推荐的建议就告诉您不要使用它。事实上，在过去，网站将所有数据和模块放入一个巨大的全球层次结构中更为常见。 但是，出于另一个原因，我仍然建议避免全局状态 - 存在一个不那么神奇的更好的解决方案。 Javascript 现在有一个标准的模块系统，可以用来代替全局状态。只需创建一个模块来保存您的应用程序具有的任何共享状态。