我想知道如何通过使用.then和.catch来改进这一点，以在这里实现相同的目标

如果您想要复制相同的行为，则无法避免嵌套：

function fetchUser2() {
  return someHttpCall().then(
    (user) => {
      return fetchUserDetails(user).then(
        (details) => {
          return displayUserDetails(details)
        },
        (fetchUserDetailsError) => {
          console.log('fetching user error', fetchUserDetailsError)
        }
      )
    },
    (someHttpCallError) => {
      console.log('networking error:', someHttpCallError)
      throw someHttpCallError
    }
  )
}

(完全等同于try/catch将使用.then(…).catch(…) instead of .then(…, …)，但you might not actually want that。)

我编写的函数是[嵌套的]，如果嵌套变得很深，它就不能很好地伸缩，而我正试图重写它以提高可读性[…]

为此，我建议将await与.catch()结合使用：

async function fetchUser() {
  try {
    const user = await someHttpCall().catch(someHttpCallError => {
      throw new Error('networking error', {cause: someHttpCallError});
    });
    const details = await fetchUserDetails(user).catch(fetchUserDetailsError => {
      throw new Error('fetching user error', {cause: fetchUserDetailsError});
    });
    return displayUserDetails(details);
  } catch (someError) {
    console.log(someError.message, someError.cause);
  }
}

(Error的cause选项仍然很新，您可能需要一个填充)