javascript - redux 可以被视为 pub/sub 或观察者模式吗？

Question

我只是想了解 react.js，也就是说，我刚刚完成了一些网络教程。

我对 redux 完全陌生，这是我观看的一些视频教程的一部分。我越深入研究它，就 redux 取代 react.js 的初始想法而言，它对我的​​意义越小。在 react 中，组件有自己的状态，可以通过 props 向下传递，以保持工作流程从上到下。

使用 redux，我们现在尝试使整个应用程序状态成为全局状态，并且我们必须定义操作来操纵该(全局)状态，那么除了“正常”的 javascript pub/sub 或观察者模式之外，这些操作是什么？或者也许我弄错了？ - 澄清将不胜感激。

Answer 1

Redux 不应该“取代 react.js 的最初想法”，它更像是一个库，用于管理组件之间的共享状态并协调状态突变。
Redux 确实使用了 pub/sub 模式，请参阅此处的 store 方法:
http://redux.js.org/docs/api/Store.html#store-methods
您会找到 subscribe组件用来订阅状态树变化的方法。通常你不会直接使用 store.subscribe，因为 Redux-React 绑定(bind)(基本上是 Redux connect)会为你做到这一点。你可以在这里查看实际的实现，遵循起来并不复杂(事实上对我来说这是 Redux 相对于其他 Flux 实现的主要好处):https://github.com/reduxjs/react-redux/blob/4.x/src/components/connect.js#L199

该代码除了订阅商店发出的更改之外，还执行一些优化，例如仅在真正需要时将新 Prop 传递给组件(并因此触发重新渲染)。

还要考虑将组件内部状态与 Redux 一起使用是非常好的。您可以使用内部状态来存储您不需要/不想与其他组件共享的状态。

当你有一个更复杂的应用程序时，你会看到像 Redux 这样的需求，顶层组件需要相互通信(操作)并以某种方式共享一些状态。

Redux 中的操作默认只是 POJO(普通的旧 javascript 对象)，您可以将它们视为您经常调度以响应用户触发的操作(例如用户单击按钮)的“事件”，但您不受限制为此，您可以从任何您想要的地方发送一个 Action 。 Redux 存储监听这些操作并调用 reducer(纯函数)传递您分派(dispatch)的操作对象。

Reducers 拦截所有分派(dispatch)的操作，它们可以为它们管理的状态切片返回一个新的、更新的状态。

从这个意义上说，reducer 是一个处理 Action 并根据需要更新状态的函数。

反过来，当 reducer 通过返回状态的新副本来更新状态时，连接的组件(订阅状态的更改)将被传递新的 props 并重新渲染以反射(reflect)更改。

有时，仅仅调度普通的 js 对象是不够的，你需要更多的控制。当您需要执行更复杂的逻辑时，这一点变得很清楚，例如，当您需要根据 AJAX 调用的响应更新状态中的计数器时。

使用 redux-thunk，您可以调度函数，而不仅仅是简单的对象。通过调度一个函数，您可以以一种非常简单的方式有效地实现控制模式的反转。你的 Action 变成了函数描述的“配方”，而不仅仅是一个简单的语句，就像 POJO Action 一样。

为什么只有 POJO 支持“开箱即用”，对于 Action ，为什么没有基本的 Action 类或其他东西？主要是因为没有必要。一个带有 type 的简单对象(基本上被认为是值的包)属性是你真正需要的，它基本上是最简单的接口(interface)。您可以认为这是针对接口(interface)(操作)而不是实现进行编程。

为什么全局状态更好，而不是每个组件管理自己的状态？主要是因为管理状态实际上是一个非平凡的 js 应用程序中最难的部分。通过使用 Redux，您可以从 UI 层提取所有逻辑，使其更易于测试。事实上，理想情况下，您应该能够测试 Redux 应用程序的所有真实“业务逻辑”，甚至无需渲染单个组件。

组件变得“笨拙”和“更纯粹”，因为它们只是呈现它们被告知要做的事情。这里的“更纯粹”意味着因为它们不持有任何状态，所以您看到的渲染仅取决于任何给定时间点的输入(读取“ Prop ”)，而不是任何历史记录，因此是“无状态的”。

将状态作为单个 json 可序列化对象还可以轻松调试、对其进行快照以及从服务器或本地存储发送/恢复。