实现项目相同请求只请求一次思路

最近跟同事一起做一个项目的一个页面，发现这个页面的基础组件多次出现，如部门列表数据。也就是项目中的异步数据多个地方使用。多个地方同时发送异步请求部门列表数据的做法比较拙劣。要实现一种公共的方法来异步获取数据，对这个数据进行缓存，已经请求过的不需要重复请求。

实现思路是：利用 Map 存发出的数据请求，不存在的话，则发送异步请求；存在的话，直接使用 Map 中的请求结果即可。

// fetchUtil.js
// 模拟异步请求
const mockRequest = (data) => new Promise((resolve, reject)=>{
    setTimeout(()=>{
      resolve("result:"+data)
    }, 250)
}) 
// 存 Map 的 key
const commonKeys = {
  channel: 'channel',
}
// 不同 key 对应的异步请求的方法
const baseMethods = {
  channel: mockRequest,
}
// 缓存 Map
const cacheFetchMap = new Map()

export const fetchOnceData = async (fetchKey, params={}) => {
    const innerTmpKey = commonKeys[fetchKey]
    if(cacheFetchMap.get(innerTmpKey)){
      const resultCache = cacheFetchMap.get(innerTmpKey)
      return await resultCache
    }else{
      const curPromise = baseMethods[innerTmpKey](params)
      cacheFetchMap.set(innerTmpKey, curPromise)
      return await curPromise
    }
}

// 测试
fetchOnceData(commonKeys.channel, 1).then(res=>{
   console.log(res)
})
fetchOnceData(commonKeys.channel, 1).then(res=>{
   console.log(res)
})