接口处理（串行、并行、并发）

开发过程中，一个页面中调用很多接口的需求还是挺常见的。
如果没有特殊要求，可以接口串行处理。

1.async await

• 定义：async function 用来定义一个返回 AsyncFunction 对象的异步函数。异步函数是指通过事件循环异步执行的函数，它会通过一个隐式的 Promise 返回其结果。如果你在代码中使用了异步函数，就会发现它的语法和结构会更像是标准的同步函数。 await 操作符用于等待一个Promise 对象。它只能在异步函数 async function 中使用。
• 语法：async function name([param[, param[, ... param]]]) { statements }

[return_value] = await expression;

项目中的处理

• 两个数据模块相互不影响，因此使用接口串行；
• 这样的好处是一个接口请求错误不影响另一个请求及渲染。

fetchData = async () => {
    const result1 = await Audit.getAuditList()
    const result2 = awaut Audit.getAuditNum()
    runInAction(() => {
    this.ListData = result1
    this.num = result2
    })
  }

开发过程中，一个页面中调用很多接口的需求还是挺常见的。
如果接口串行处理就会导致页面模块逐个渲染，有些场景不符合需求。
这个时候就可以使用promise.all接口并行

2.Promise.all

• 定义：Promise.all(iterable) 方法返回一个 Promise 实例，此实例在 iterable 参数内所有的 promise 都“完成（resolved）”或参数中不包含 promise 时回调完成（resolve）；如果参数中 promise 有一个失败（rejected），此实例回调失败（reject），失败原因的是第一个失败 promise 的结果。
• 语法：Promise.all(iterable); iterable一个可迭代对象，如 Array 或 String。

项目中的处理

• 因为两个数据要同时渲染不要造成用户体验上面的页面渲染时间差，所以使用promise.all接口并行；
• 返回的对象数组根据索引把需要的值分别放到各自状态值里；
• 这样做有缺点一个接口失败另一个也失败，使用前需要好好梳理模块的渲染关系。

fetchData = async () => {
    const result = await Promise.all([Audit.getAuditList(),             Audit.getAuditNumber()]).catch(e=>console.info(e))

      runInAction(() => {
          this.setListData(result[0].value)
        this.num = result[1]
      })
  }

开发过程中，一个页面中可能会出现多个模块调用一个接口。
这时候就要考虑接口并发了。
项目中暂时没有遇到，这个只是扩展

3.Promise + Array

• 可以通过接口缓存，请求时查询当前进行中的请求会有哪些情况
• 如果有相同的就返回已经存在的，没有就加入缓存

下面有一个接口处理 返回的是promise对象

getNum = async () => {
    const result: { appCount: number; carCount: number } = await requs.get('/test')
    return result
  }

这个时候就需要一个数组来把返回的promise对象存起来，根据promise的特性，无论处于什么状态（pending 、fulfilled、rejected）都能.then拿到结果。

let promiseResult :{
    key : string
    result : any  // 这个地方可以根据需求改类型这里用any代替
}[]
const comparePromise = ( url: string, params: any) => {
    const key = url + JSON.stringfy(params)
    const resultes = promiseResult.filter(item => item.key === key)
    if(resultes.length > 0){
        console.warn('jinggao')
        return resultes[0].result
    } else { return false }
}

这个时候防止数组的内存溢出可以开启一个定时清除的任务

setInterval(()=>{
    promiseResult = []
},600000)