Promise链执行完成后如何脱离链调用startApp函数？

Great question! Let's break down your two questions clearly:

1. 当前的写法是否可行？ #

Technically, it does work—your app will load the data and start up as expected. But it has a critical maintainability flaw: any errors thrown inside startApp (or async operations it triggers that reject) will get caught by the final .catch() in your promise chain. This mixes two completely separate error categories:

• Errors related to loading your initial data (network failures, invalid JSON, etc.)
• Errors in your application's runtime logic

This makes debugging way harder, since you can't quickly tell if a logged error came from failed data loading or a crash in your app after it started. So while it functions, it's not a clean or recommended approach.

2. 如何等待Promise链结束后调用startApp且不处于链内？ #

The core goal is to separate data-loading error handling from your app's runtime error handling. Here are two clean, readable solutions:

Approach 1: Use async/await (most intuitive) #

Async/await makes it trivial to split these concerns clearly:

async function initializeApp() {
  try {
    // Handle data loading with its own error boundary
    const response = await fetch('path/to/data.json');
    const data = await response.json();
    console.log(`Hey cool, we're done w/ the promise chain here`);

    // Start the app—errors here won't be caught by the loading try/catch
    startApp(data);
  } catch (loadError) {
    console.error(`Error loading initial data: ${loadError}`);
    // Optional: Handle loading failure (show error page, retry, etc.)
  }
}

initializeApp();

If startApp includes async logic, add a dedicated error handler inside it:

function startApp(data) {
  try {
    // Your app initialization logic (including async calls) here
  } catch (appError) {
    console.error(`Error starting app: ${appError}`);
  }
}

Approach 2: Keep the .then() chain but isolate startApp #

If you prefer sticking with promise chains, just avoid linking startApp into the chain so its errors don't propagate to the loading catch:

fetch('path/to/data.json')
  .then((response) => response.json())
  .then((data) => {
    console.log(`Hey cool, we're done w/ the promise chain here`);
    // Call startApp without returning its result to the chain
    startApp(data);
  })
  .catch((loadError) => console.error(`Error loading data: ${loadError}`));

// For async startApp, handle errors internally
async function startApp(data) {
  try {
    // Async app setup logic here
  } catch (appError) {
    console.error(`App initialization failed: ${appError}`);
  }
}

The key here is that we don't return the promise from startApp in the final .then(), so any rejection from startApp won't flow into the chain's .catch().

内容的提问来源于stack exchange，提问作者Scott Thiessen