基本信息
文件名称:编程课件-09_Redux的使用详解.pdf
文件大小:1.48 MB
总页数:28 页
更新时间:2025-02-13
总字数:约8.25千字
文档摘要

Redux的使用详解(一)

王红元coderwhy

目录

1Redux的核心思想

content

2Redux的基本使用

3React结合Redux

4Redux的异步操作

5redux-devtool

6reducer的模块拆分

coderwhy理解JavaScript纯函数

?函数式编程中有一个非常重要的概念叫纯函数,JavaScript符合函数式编程的范式,所以也有纯函数的概念;

?在react开发中纯函数是被多次提及的;

?比如react中组件就被要求像是一个纯函数(为什么是像,因为还有class组件),redux中有一个reducer的概念,也是要求

必须是一个纯函数;

?所以掌握纯函数对于理解很多框架的设计是非常有帮助的;

?纯函数的维基百科定义:

?在程序设计中,若一个函数符合以下条件,那么这个函数被称为纯函数:

?此函数在相同的输入值时,需产生相同的输出。

?函数的输出和输入值以外的其他隐藏信息或状态无关,也和由I/O设备产生的外部输出无关。

?该函数不能有语义上可观察的函数副作用,诸如“触发事件”,使输出设备输出,或更改输出值以外物件的内容等。

?当然上面的定义会过于的晦涩,所以我简单总结一下:

?确定的输入,一定会产生确定的输出;

?函数在执行过程中,不能产生副作用;

coderwhy副作用概念的理解

?那么这里又有一个概念,叫做副作用,什么又是副作用呢?

?副作用(sideeffect)其实本身是医学的一个概念,比如我们经常说吃什么药本来是为了治病,可能会产生一些其他的副作

用;

?在计算机科学中,也引用了副作用的概念,表示在执行一个函数时,除了返回函数值之外,还对调用函数产生了附加的影响,

比如修改了全局变量,修改参数或者改变外部的存储;

?纯函数在执行的过程中就是不能产生这样的副作用:

?副作用往往是产生bug的“温床”。

coderwhy纯函数的案例

?我们来看一个对数组操作的两个函数:

?slice:slice截取数组时不会对原数组进行任何操作,而是生成一个新的数组;

?splice:splice截取数组,会返回一个新的数组,也会对原数组进行修改;

?slice就是一个纯函数,不会修改数组本身,而splice函数不是一个纯函数;

coderwhy判断下面函数是否是纯函数?

coderwhy纯函数的作用和优势

?为什么纯函数在函数式编程中非常重要呢?

?因为你可以安心的编写和安心的使用;

?你在写的时候保证了函数的纯度,只是单纯实现自己的业务逻辑即可,不需要关心传入的内容是如何获得的或者依赖其他的

外部变量是否已经发生了修改;

?你在用的时候,你确定你的输入内容不会被任意篡改,并且自己确定的输入,一定会有确定的输出;

?React中就要求我们无论是函数还是class声明一个组件,这个组件都必须像纯函数一样,保护它们的props不被修改:

?在接下来学习redux中,reducer也被要求是一个纯函数。

coderwhy为什么需要redux

?JavaScript开发的应用程序,已经变得越来越复杂了:

?JavaScript需要管理的状态越来越多,越来越复杂;

?这些状态包括服务器返回的数据、缓存数据、用户操作产生的数据等等,也包括一些UI的状态,比如某些元素是否被选中,是否显示

加载动效,当前分页;

?管理不断变化的state是非常困难的:

?状态之间相互会存在依赖,一个状态的变化会引起另一个状态的变化,View页面也有可能会引起状态的变化;