React面试题总结（一）

1、redux本来是同步的，为什么它能执行异步代码？实现原理是什么？中间件的实现原理是什么？

1、Redux-thunk这个中间件支持异步操作

2、执行异步的操作首先需要下载一个thunk，通过thunk来进行异步的一个操作，支持异步操作，可以使用dispatch和getState来进行数据的获取或状态

3、Redux是一个状态管理库，redux的核心是store,actions,reducers三个部分

4、通过dispatch发放到任务的actions中，在actions中返回一个promise对象，再通过dispatch派发到reducers中

5、在reducers中通过传递type和data来进行判读

2、redux中同步action与异步action最大的区别是什么？

1、同步action：执行了dispatch函数之后，对应的reducer纯函数立即得到执行，reducer执行完了之后，state立即就改变了，此时用store.getState函数，取到的是最新的state值；

2、异步action：原则上redux并没有提供异步action的处理方案，异步的action需要依赖第三方的中间件解决（如redux-thunk），dispatch了一个异步action（本质上是dispatch的一个函数）之后，目标state并不会立即响应，而是要看异步函数内部的逻辑，来决定state什么时候响应。

3、区别：
首先区别redux和react-redux，redux是一个单独的模块，在其他框架中也能使用，而react-redux是为react管理数据而生。
redux的设计思想：web应用是一个状态机，视图与状态是一一对应的，所有的状态，保存在一个对象里面

3、redux-saga和redux-thunk的区别与使用场景？

1、使用redux-thunk的代码，当我们返回的是函数时，store会帮我们调用这个返回的函数，并且把dispatch暴露出来供我们使用。对于redux-thunk的整个流程来说，它是等异步任务执行完成之后，我们再去调用dispatch，然后去store去调用reduces

2、使用了redux-saga的代码，当我们dispatch的action类型不在reducer中时，redux-saga的监听函数takeEvery就会监听到，等异步任务有结果就执行put方法，相当于dispatch，再一次触发dispatch。对于redux-saga的整个流程来说，它是等执行完action和reducer之后，判断reducer中有没有这个action

区别：

• redux-thunk和redux-saga处理异步任务的时机不一样。对于redux-saga，相对于在redux的action基础上，重新开辟了一个 async action的分支，单独处理异步任
• saga 自己基本上完全弄了一套 asyc 的事件监听机制，代码量大大增加，从我自己的使用体验来看 redux-thunk 更简单，和 redux 本身联系地更紧密。

4、为什么普通的for循环比forEach循环性能要高？

1、for循环就是通过下标，对循环中的代码反复执行，功能强大，可以通过index取得元素。处理比较复杂的处理的时候比较方便

2、forEach()循环方法用于调用数组的每个元素，并将元素传递给回调函数。foreach有的也叫做增强for循环，forEach其实是for循环的一个特殊简化版。forEach循环对于空的数组是不会执行回调函数的。

区别：

1、遍历：for循环按照顺序进行遍历，forEach使用iterator迭代器遍历

2、数据结构：for循环是随机访问元素，foreach是顺序链表访问元素

3、 性能上：对于数组arraylist来说，是顺序表，使用for循环可以进行顺序访问，速度比较快；使用foreach循环会比for循环稍微慢一点。对于linedlist来说，是单链表，使用for循环每次都要从第一个元素读取next域来读取，速度非常慢；使用foreach可以直接读取当前的节点，数据较快。

5、说说你对useEffect的理解，可以模拟哪些生命周期？

1、使用钩子函数useEffect可以实现组件的副作用。useEffect(希望执行的动作, [组件状态的列表]);第二个参数用来处理useEffect调用的时机，是一个数组，数组内是组件状态的列表。

2、useEffect模拟componentDidMount：当useEffect的第二个参数传入空列表时，相当于模拟生命周期函数componentDidMount。这个副作用仅在组件第一次挂载ui的时候调用一次。用它来模拟组件初次挂载时，访问api、获得数据：

3、useEffect模拟componentDidUpdate：如果在使用useEffect时不带上第二个参数，就相当于模拟了生命周期函数componentDidUpdate。每次渲染结束的时候都会被调用。

4、useEffect模拟componentWillUnmount，在useEffect中返回一个函数用于模拟component WillUnMount