首页 | 新闻 | 新品 | 文库 | 方案 | 视频 | 下载 | 商城 | 开发板 | 数据中心 | 座谈新版 | 培训 | 工具 | 博客 | 论坛 | 百科 | GEC | 活动 | 主题月 | 电子展
返回列表 回复 发帖

Redux 简介(1)

Redux 简介(1)

状态管理是软件开发的最困难方面之一,这使得状态管理错误成为了几乎所有 bug 的源头。本系列将探索  ,这是一个针对 JavaScript 应用程序的可预测的状态容器。Redux        不仅有助于状态管理,还使得实现一些高级特性变得很简单,比如无限撤销/重做和实时编辑时间旅行 (live-editing time travel)。
尽管 Redux 来自   社区,但它并不依赖于 React。无论有没有        JavaScript 框架,比如 React、Angular、Backbone 或 Cycle.js,都可以使用 Redux。在第一期文章中,首先将了解 Redux        基础知识,学习如何使用它作为独立的状态容器;然后继续探索如何结合使用 Redux 和 React。后续几期文章将介绍更高级的 Redux 场景,在最后一期文章中,将学习如何结合使用        Redux 和 Angular。
Redux 的工作原理安装 Redux可通过克隆 GitHub   或通过 npm 来安装            Redux:npm install redux

Redux 是 Facebook 的            架构的一种简化实现。(Redux 既是一个表示 “已返回” 的英文单词,也是 reducer + flux        的混合词。)Flux 在本质上采用了模型-视图-控制器 (MVC) 的结构,但引入了很高的复杂性。Redux 从   借用了缩减程序 (reducer) 的概念来降低了这一复杂性,Elm        是一个基于不可变数据结构和纯函数的强大的反应式函数编程语言。纯函数是没有副作用的函数,Redux 缩减程序是计算应用程序状态的纯函数。
Redux 有 3 条原则:
  • 应用程序状态存储在单个对象中。
  • 应用程序状态不可变,只能通过描述状态更改的操作 彻底替换。
  • 缩减程序根据当前状态和某个操作来创建下一个状态。
应用程序状态存储在单个对象中Redux 通过一个 JavaScript        对象管理状态,该对象称为数据存储,包含应用程序的所有状态。将状态集中保存在一个对象中,这使得在阅读代码时推断应用程序数据变得更容易。另外,当所有数据都在一个位置时,应用程序更容易调试和测试。将应用程序状态存储在一个对象中,还使持久保存应用程序的整体状态变得更容易。
应用程序状态不可变对于 Redux,您不能修改应用程序状态。而需要使用新状态替换现有状态。新状态由操作指定,操作也是不可变的 JavaScript 对象,用于描述状态更改。
将状态更改封装在不可变的对象中有许多优点。尽管封装状态更改时使用了模式,但封装状态更改远不止使用模式那么简单,所以最好连同引用一起删除。您在本系列文章中将会看到,其中一个优点是能够实现无限撤销和重做        — 实际上类似于时光机。操作也按严格的顺序执行,所以不会发生竞争条件。
缩减程序创建一种新状态缩减程序是纯 JavaScript 函数,它们:
  • 根据当前状态和某个操作来创建一个新状态
  • 集中化数据变化
  • 可处理所有或部分状态
  • 可组合和重用
因为它们是纯函数,缩减程序没有副作用 — 所以它们很容易读取、测试和调试。您可以构造缩减程序,轻松实现仅关注整体应用程序状态的一部分的简单缩减程序。
因为应用程序状态不可变,而且因为缩减程序是没有副作用的纯函数,所以 Redux 是一个可预测的        状态容器:给定任何状态和任何操作,您就可以非常肯定地预测应用程序的下一个状态。Redux 的这种可预测元素是一个非常好的特性,使实现无限撤销/重做和实时编辑时间旅行成为可能。
我们接下来将通过两个示例演示一下 Redux 的基础原理。
返回列表