• JS 同时获取多个异步请求数据 Promise.all() Jim


    普通接口调用写法.then() 或者 使用es6的 async/await 异步转同步

    //   function Index() {
    //       普通调用嵌套写法
    //       console.time()
    //       const p1 = new Promise((resolve, reject) => {
    //         console.log('这里是p1')
    //         setTimeout(() => {
    //           resolve('这里是p1的返回')
    //         }, 1000)
    //       }).then((r1) => {
    //         new Promise((resolve, reject) => {
    //           console.log('这里是p2')
    //           setTimeout(() => {
    //             resolve('这里是p2的返回')
    //           }, 1000)
    //         }).then((r2) => {
    //           console.log(r1)
    //           console.log(r2)
    //           console.timeEnd()
    //         })
    //       }) 
    //     }
     
    //异步转同步
    async function Index2() {
          console.time()
          const p1 =await new Promise((resolve, reject) => {
            console.log('这里是p1')
            setTimeout(() => {
              resolve('这里是p1的返回')
            }, 1000)
          })
          const p2 =await new Promise((resolve, reject) => {
            console.log('这里是p2')
            setTimeout(() => {
              resolve('这里是p2的返回')
            }, 1000)
          })
          console.log(p1)
          console.log(p2) 
          console.timeEnd()
       }
        //Index();
        Index2();

    用时2

     使用Promise.all()来实现调用

      async function Index() {
          console.time()
          const p1 = new Promise((resolve, reject) => {
            console.log('这里是p1')
            setTimeout(() => {
              resolve('这里是p1的返回')
            }, 1000)
          })
          const p2 = new Promise((resolve, reject) => {
            console.log('这里是p2')
            setTimeout(() => {
              resolve('这里是p2的返回')
            }, 1000)
          })
          Promise.all([p1, p2]).then((val) => {
            console.log(val)
            console.timeEnd()
          })
           //当然也可以使用 async/await写法
           /*   
            const p = await Promise.all([p1, p2])
            console.log(p);
            console.timeEnd(); 
            */
           //补充说明:如果我们的接口已经套上了一层 promise 便已经实现了同时执行异步的条件
           //下面这种写法耗时和Promise.all也是一样的,但是嵌套多了可能代码就不太优雅了
           /*  p1.then((r1) => {
            p2.then((r2) => {
              console.log(r1)
              console.log(r2)
              console.timeEnd()
            })
          }) */
            
        }
        Index()

    用时1s

  • 相关阅读:
    Eclipse 的SVN 插件
    linux克隆后修配置
    SVN服务器端环境搭建步骤
    Linux安装 jdk、tomcat、eclipse、mysql
    Linux RPM和YUM
    linux进程管理
    day21
    day20
    day18 作业
    day 19
  • 原文地址:https://www.cnblogs.com/huoshengmiao/p/15576780.html
Copyright © 2020-2023  润新知