面试了许多求职者,很多求职者只知其然,而不知所以然,写此文章为广大前端小伙伴指引迷津。纯干货!纯干货!纯干货!
目录
Redux
什么是React?
答:专门为React应用程序开发的状态管理模式。
为什么要使用Redux?
答:项目不需要开发大型的单页应用,此时你完全没有必要使用Redux,项目达到了中大型应用的规模,如何更好地在组件外部管理状态,Redux 将会成为自然而然的选择。
Redux的组成部分?
答:action、reducer、store。
action: 两个属性:type:标识,payload:数据。
reducer:根据传入的旧状态和action,返回新状态。
store: 仓库,Redux 的核心,整合 action 和 reducer。
- redux三个原则:
- 单一事实来源:整个应用的状态存储在单个 store 中的对象/状态树里。单一状态树可以更容易地跟踪随时间的变化,并调试或检查应用程序。
- 状态是只读的:改变状态的唯一方法是去触发一个动作。动作是描述变化的普通 JS 对象。就像 state 是数据的最小表示一样,该操作是对数据更改的最小表示。
- 使用纯函数进行更改:为了指定状态树如何通过操作进行转换,你需要纯函数。纯函数是那些返回值仅取决于其参数值的函数。
数据修改流程?
- 当你需要更新状态时,就先分发动作 store.dispatch(action)
- Redux 内部,store 就会调用 reducer,传入:上一次的状态 和 action ,计算出新的状态,并返回。
- reducer 执行完毕后,将最新的状态交给 store,store 用最新的状态替换旧状态,状态更新完毕。
小项目解决方案Mobx
- Mobx
Redux 有个问题,就是修改某个 state 的时候,需要经过 action.js、types.js、reducers.js 这一系列文件,这样子 Redux 的数据流虽然非常正规,但是写起来复杂啊。
所以,社区又出现了另一套解决方案,也就是 Mobx。
Mobx 推崇代码简约移动,只需要定义一个可贯彻的对象,然后在哪个组件中使用到了这个可观察对象,并且这个对象的数据有更改,那就会重新渲染,这使得 Mobx 开发项目的时候可以简单快速地完成很多功能。
但是 Mobx 也有缺点,就是数据流太过随意,出了 Bug 不好定位。
- End
所以,针对于小项目来说,社区推荐使用 MobX,对大项目推荐使用 Redux。
Redux页面刷新数据丢失问题解决方法?
答:sessionStorage、react插件(redux-persist)等。
面试大白话
答:首先,Redux是专门为Redux应用程序开发的状态管理模式。其主要目的也是为了中大型项目中,更好地在组件外部管理状态。它主要包括几个部分...我们项目里面一般就是sessionStorage结合Redux使用,防止页面刷新数据丢失问题。不过Redux还是结合实际来使用,项目不需要开发大型的单页应用,此时完全没有必要使用Redux,并且Redux写起来比较繁琐,小项目的话可以用mobx代替。