Redux 是一个用于 JavaScript 应用程序的状态容器，它是 React 生态系统中最流行的状态管理库之一。Redux 采用了一套特定的架构思想来帮助我们更好地管理应用程序的状态，这也是它的三大核心概念的基础。
第一大核心概念：State
Redux 应用程序的状态由一个称为 state 的 JavaScript 对象来表示。state 对象通常是由多个子状态（sub-states）组成，这些子状态对应于应用程序中的不同部分。例如，一个电子商务应用程序的 state 对象可能包含购物车状态、用户登录状态、产品详情状态等等。
这个 state 对象是不可变（immutable）的，也就是说，我们不能直接改变它的值，只能通过派发一个 action 来触发（trigger）状态的变化。这样做的好处是能够避免很多状态管理上的问题，例如数据竞争、可预测性等等。
以下是一个简单的 state 对象的示例：
// 初始状态 const initialState = { count: 0, todos: [] }
第二大核心概念：Action
Action 是一个简单的 JavaScript 对象，它描述了应用程序中发生的事件或动作。每个 action 对象都包含一个 type 属性，用于指示该动作的类型。除此之外，action 对象还可以包含一些其他属性，这些属性描述了该动作的具体内容。
例如，以下是一个增加计数器值的 action 对象的示例：
// 增加计数器值的 action const increaseCounter = { type: 'INCREASE_COUNTER', payload: 1 }
在 payload 属性中，我们可以传递任何数据，例如数字、对象、数组等等。这些数据可以用来描述动作的具体内容，当我们处理（handle）该动作时，可以使用这些数据来更新应用程序的状态。
第三大核心概念：Reducer
Reducer 是一个纯函数（pure function），它的作用是根据接收到的 action 对象和当前的 state 对象来计算新的 state 对象。在 Reducer 函数中，我们会根据接收到的 action 的 type 属性来决定如何处理该动作。
以下是一个简单的 Reducer 函数的示例：
-- -------------------- ---- ------- -- ------- -- -------- -------------------- - ------------- ------- - ------ ------------- - ---- ------------------- ------ - --------- ------ ----------- - -------------- - -------- ------ ----- - -展开代码
在上面的示例中，我们针对 INCREASE_COUNTER 动作定义了一个相应的处理函数，它会使用 payload 属性来增加计数器值。如果接收到的 action 对象的 type 属性不是 INCREASE_COUNTER，则返回当前的 state 对象。
总结
Redux 的三大核心概念是 state、action 和 reducer。state 对象表示了应用程序的状态，action 对象表示了应用程序中发生的事件或动作，而 reducer 函数负责根据接收到的 action 对象和当前的 state 对象来计算新的 state 对象。
学习和理解 Redux 的核心概念对于编写 React 应用程序非常重要。如果想深入学习 Redux，建议阅读 Redux 官方文档或相关书籍，并且通过编写代码来掌握它的使用方法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c086e89e06631ab9cd94f6
