Redux学习之二：从action到store？

3d蜜桃,潍坊妇幼保健院,生化奇兵:无限

redux里面的概念很多，有Action、ActionCreator、reducer、store、middleware、Provider、Connect……概念不理解，就是眉毛胡子一把抓，弄不出头绪。redux的概念，通过一张图大家就一目了然了。
图片描述

这张图大致可以概括redux的整个流程。从图中我们可以看出，Action是数据流动的开始，Reducer负责业务逻辑处理，store是整个流程的中轴。

1、你从哪里来?——谈谈actions的起源

redux里的action和flux里的action大体上一致，不同的是设计理念的差别。flux里的action是以函数的形式，但在redux里，action被设计成普通的js对象。

{
type: 'ADD_TODO',
text: 'Build my first Redux app'
}
这就是一个最基本的action，必须注意的是，type是action必须的一个key值，是action的唯一标识。其它的key可以使任意像传递的数据结构。
但是actions到底代表什么？
actions代表着数据来源的萃取。我们的view界面需要很多数据结构，如ajax返回的数据、路由状态跟踪、UI状态等。。。关键的是这些数据都是动态流动的，既然流动，就要有入口、有方向。actions就是代表数据流动的开始，携带的key值中，type代表发生了什么事情，其它的就是需要流动的数据结构。
归纳起来，actions是数据从应用传到store的有效载荷，是store唯一的数据来源。
那么如何产生一个action，这就是又有一个概念actionCreator:

function addTodo(text) {

return {
type: ADD_TODO,
text
};

}
actionCreator实际上是一个返回action值的函数而已。这样，只需把 action 生成器的结果传给 dispatch() 方法即可实例化 dispatch。

dispatch(addTodo(text));

2、条条大路通哪里?——看看reducer的神奇

action表示发生了什么事情，表明了有事情发生，肯定会对应用的数据产生影响。我们知道，React组件内的数据都是以state的形式存在的，state代表着数据结构。那么就要问了，action的发生到底会对state产生什么影响。这就是reducer的作用了。
reducer 其实是一个函数， 接收旧的 state 和 action， 返回新的 state。

(previousState, action) => newState

这种设计来源于函数式编程思想，简单，易懂，没有副作用。

function todoApp(state = initialState, action) {
switch (action.type) {
case SET_VISIBILITY_FILTER:

xCodeGhost 事件专题总结

最近闹的沸沸扬扬的xCodeGhost事件，一开始是由阿里的蒸米、讯迪在乌云发布了深度的病毒解析，随后腾讯安全研究员也跟进分析。由于此病毒感染了包括网易云音乐、滴滴出行等一批用户量很大的手机APP，在知乎也引起了网友的热议，知乎网友称此事件的影响难以估量。最后看雪的安全研究员也发布了一款病毒检测工具。