解析一个使用 Promise 的函数

Question

我有以下异步函数

export default async function getUserNames(id: string[]): Promise<string[]> {
    let userNames: string[] = [];
    // We do some stuff here like calling a service, etc...

    return userNames;
}

在另一个打字稿文件上，我正在导入 getuserNames 函数并尝试像这样调用它：

const promiseResult = getUserNames(idList)
        .then(result => {
            return result;
        })
        .catch(error => {
            return undefined;
        });

    if (promiseResult) {
        // Do something else here.
    }

但是，promiseResult 类型是 Promise 而不是我所期望的 string[]。如何调用 getuserNames 函数，完成后，将实际的 string[] 返回给 promiseResult 变量？

编辑 做这样的事情是否被接受？

let varB: string[];
const promiseResult = getUserNames(idList)
        .then(result => {
            varB = result;
        })
        .catch(error => {
            varB = undefined;
        });

if (varB) {
        // Do something else here.
    }

最后，请注意调用 getUserNames 的函数未定义为异步，我无法更改。

Answer 1

您无需在代码中使用 async/await。

/**
 * async data fetcher
 * @param {String} url 
 * @param {Object} options 
 * @returns {Promise}
 */
const fetch = (url, options) => {
  return new Promise((resolve, reject) => {
    fetch(url, options)
      .then((response) => {
        if (response.ok) {
          return resolve(response.json)
        }
        return reject(response.json)
      })
      .catch((error) => reject({ error }))
  })
}

/**
 * async fetch wrapper, returns a Promise
 * @param {NUmber} id 
 * @returns {Promise}
 */
const getUserNames = (id) => {
  return fetch('www.yourapi.com/get_user_names', { params: { id } })
}

const idList = [1, 2, 3]
// so, your code also will be asyncronious too:
Promise.all([getUserNames(idList)]).then((promiseResult) => {
  if (promiseResult) {
    // Do something else here.
  }
})

Answer 2

getUserNames 确实返回了 promise<string[]>，这正是它的签名所说的。

您应该在then 中执行您的if (result)

或者您可以使用新的 await 关键字，这将确保承诺在分配给 promiseResult 之前得到解决 在这种情况下，请将您的 await 包装在 try/catch 中。

Answer 3

如果您想访问 promise 解析为的值，您唯一的选择是

1) 使用 promise 的 .then 回调

getUserNames(idList)
  .then(result => {
    // Do something else here.
  })

2) 将代码放入异步函数中并使用 await 关键字：

async function someFunction () {
  const result = await getUserNames(idList);
  // Do something else here.
}

请注意，由于所有异步函数都返回 Promise，因此在此示例中 someFunction 将返回 Promise。