# fed-e-task-04-05

**Repository Path**: frontend_site/fed-e-task-04-05

## Basic Information

- **Project Name**: fed-e-task-04-05
- **Description**:         通过使用 TypeScript 编程语言，基于 React 全家桶（React、React Router、Redux、React Redux、Ant Design）开发在线教育课堂项目。通过实战深入掌握 React 及其相关技术栈的使用。
        
- **Primary Language**: Unknown
- **License**: ISC
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2021-03-03
- **Last Updated**: 2021-03-14

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

## 1.通过该项目，请简要说明 typescript 比 javascript 的优势在哪？

1. 静态类型检测
   + 允许开发人员编写更健壮的代码并对其进行维护
2. 使用typescript开发大型项目，易于代码重构，减少代码错误
3. 类型安全，在编码期间检测错误的功能，而不是在编译项目时检测错误



## 2.请简述一下支付流程

1. 当用户点击支付按钮时，向后台服务器端发送请求，服务器校验用户信息信息；
2. 后台代码会响应一个重定向地址，让浏览器重定向到第三方支付页面，完成支付动作；
3. 当用户完成支付，支付宝会重定向，重定向到前端之前设置好的一个客户端地址，用来告诉用户支付成功还是失败；
   

## 3.react-redux 的主要作用是什么，常用的 api 有哪些，什么作用？

### 1.主要作用

​		使react组价与redux数据中心（store）联系起来，调用dispatch函数修改数据状态后，触发通过subscribe注册更新视图的处理逻辑；

### 2.常用API

HOC（高阶组件）：Provider ；返回一个HOC（高阶组件）的函数：conncet

### 3.主要作用

1. Provider ，让通过props传递进来的store对象挂载到context环境上，并且渲染props.children；

   + 以便在`connect(mapStateToProps, mapDispatchToProps )` 返回的HOC中，通过context可以获取到store对象
   + 再通过store.subscribe函数，注册组件更新的逻辑

2. conncet，输入两个函数作为参数：mapStateToProps、mapDispatchToProps，返回一个HOC；

   + 在HOC中通过this.context获取到Provider中往下传递的store对象；

   + 在store.subscribe中注册视图更新逻辑；

   + 通过store.getState()作为mapStateToProps函数的参数，store.dispatch作为mapDispatchToProps的参数，生成两个对象；

   + 将产生的两个对象，通过props传递给真正的视图组件使用；

     

## 4.redux 中的异步如何处理？

​		通过applyMiddleware函数，借助redux中间件来处理，即**通过中间件模式将原始dispatch函数进行封装处理，形成洋葱模型**，将原始dispatch函数作为参数传递，在处理异步事件时，再调用原始dispatch函数修改数据状态