zoukankan      html  css  js  c++  java
  • ES7异步函数解决进程等待相关业务问题

    业务需求场景描述:

    在接口只能单一检测的情况下,批量检测资源名称是否存在数据库,如果资源群中某一个资源已存在:给出交互让用户决定是否覆盖资源,最后形成不存在的资源和用户确定覆盖的资源群,进行提交。

    业务关键:

    1,单一检测存在异步操作

    2,用户决定是否覆盖已存在资源,则需要程序等待效果

    业务实现(基于Element-ui的$confirm确认消息提示组件):

    /**
     * 使用ES7的异步函数解决进程等待问题
     * @param resourceArray  待检测资源群[name1,name2]
     * @returns [] 返回检测结果(不存在的资源和用户确认需要覆盖的资源)
     */
    const loopCheckResName=async (resourceArray)=>{
      let resultRes=[];
      for(let i =0,len=resourceArray.length;i<len;i++){
        const curResName=resourceArray[i];
        const response=await this.$api.checkName(curResName);
        if(response.code===404){
            resultRes.push(curResName);
        }else{
          try{
            //这里会阻塞for循环,待用户确认
            await this.$confirm(`资源${curResName}已存在,是否覆盖?`);
            resultRes.push(curResName);
          }catch(e){
            console.log("用户放弃了覆盖")
          }
          
        }
      }
      return []
    }

    这里可能会有两个疑问:

    1,为什么使用for循环,不使用forEach或者every?

    2,为什么在循环提示时使用try...catch进行异常处理?

    回答:

    1,因为forEach和every内部的回掉函数本身是异步的

    2,异步函数的异常只能使用try来进行处理,如果不进行异常处理将不会进入下一次循环,而是直接退出了for循环

    具体牵扯到的知识点有兴趣可以去了解。这里只对当前业务场景进行解释

  • 相关阅读:
    preflight
    vs调试的时候,加载dll非常慢的解决方法
    chrome blink render engine and the render mechanism
    Cache-control demestified
    IE文档模式和兼容模式
    canvas和SVG分析比较
    打败 IE 的葵花宝典:CSS Bug Table
    vi 编辑器
    JS高级 1
    特效四大家族
  • 原文地址:https://www.cnblogs.com/Brose/p/es7_await.html
Copyright © 2011-2022 走看看