Promise执行顺序以及同步执行

Promise的执行顺序

promise是一个异步任务，如果我们需要将promise变成同步执行，我们可以使用 async-await 让进程等待，直到promise执行完毕后再执行下面的任务

async function getListTabs(menuId = null) {
  try {
    let listNav = await getInfo(menuId).then((res) => {
      listNav = getListCut(res.data[0]);
      return listNav
    });
    return listNav
  } catch (err) {console.log(err);}
}

// 调用
let data = getListTabs(10)

上面的例子只是说明 async-await 可以解决异步进程执行顺序的问题，实际上可以简化成下面的写法：

async function getListTabs(menuId = null) {
  try {
    let res = await getInfo(menuId)
    let listNav = getListCut(res.data[0]);
    return listNav
  } catch (err) {console.log(err);}
}

// 调用
let data = getListTabs(10)

需要注意的是，async-await其实是一个Promise，在对async-await的认知中，async-await会让Primise变成同步执行，只有返回后，下面的进程才会执行，但事实上，async是一个Promise，所以在下面的例子中，最终执行的结果是 2 1

async function A() {
  await B();
  console.log(1)
}

function B() {
  return new Promise((resolve) => resolve());
}

function getPromise() {
  A()
  console.log(2)
}

getPromise() // 2 1

Promise同步执行

微信小程序的api都是异步执行，这里封装一个获取图片信息的函数

    // 获取图片信息
    async getImgInfo(file) {
      try {
        let image = await new Promise((resolve, reject) => {
          wx.getImageInfo({
            src: file.tempFilePath,
            success(res) {
              let imgInfo = {
                type: res.type,
                height: res.height,
                width: res.width
              }
              resolve(imgInfo)
            },
            fail(err) {
              reject(err)
            }
          })
        })
        return image
      } catch (err) { console.log(err); }
    }

该函数调用时使用async-await可以变为同步执行

async afterRead(event) {
  const { file } = event.detail;
  let imgInfo = await this.getImgInfo(file);
  console.log('图片信息', imgInfo);
}

getImgInfo函数被声明为async函数，而在内部使用了async-await语法来处理wx.getImageInfo方法返回的Promise对象。这样可以更好地处理异步操作，并且可以更清晰地捕获和处理错误。

Promise.all接口同时请求

遇到多个接口需要同时请求，可以使用Promise.all

Promise.all([getProvinceAPI(params), getCityAPI(params)]).then(([res1, res2]) => {
  // res1第一个接口结果， res2第二个接口结果，依此类推
)

你也可以使用更优雅的写法async-await

async getInfo() {
let [res1, res2] = await Promise.all([getProvinceAPI(params), getCityAPI(params)]);
  // res1第一个接口结果， res2第二个接口结果，依此类推
}