优化js异步网络请求？

Question

老师们好，下面的代码如何优化比较好维护：

getAccountById(val).then(res=> {
   getUserSourceInfo(res.content.orgSourceId).then(res => {
       console.log("res:", res.content)
  }). catch(res => {})
}) .catch(res => {})

目前没有想到好的优化方案

Answer 1

async function Callback<CT>(promise: Promise<CT>) {
  return promise
    .then((data: CT) => [null, data])
    .catch((err) => [err, null])
}


async function getUser() {
  const [acccountError, account] = await Callback(getAccountById(val));
  if (acccountError) {
    return;
  }

  const [useError, userInfo] = await Callback(getUserSourceInfo(account.content.orgSourceId));
  if (useError) {
    return;
  }

  //  写入全局store
  window.localStorage.setItem('user', userInfo)
}

Answer 2

除了其他答主提到的 async/await之外，也可以使用：

1. 中间件方式

   const finalResult = await fn1(fn2(fn3))

2. rxjs，管道符

3. 链式调用

   fn1(args).fn2(args).fn3(args)

Answer 3

try {
    const account = await getAccountById(val)
    try {
        const userSourceInfo = await getUserSourceInfo(account.content.orgSourceId)
        console.log('res:', res.content)
    } catch (err) {
        // 错误处理
    }
} catch (err) {
    // 错误处理
}