面试题：JavaScript 函数调用的复杂错误处理

Question

假设你有一个函数`fetchData`，它通过`fetch` API从服务器获取数据。该函数返回一个Promise。如果在网络请求过程中发生错误（例如网络连接失败、服务器响应状态码非200），或者在解析响应数据时出错，如何全面地处理这些错误并向调用者提供有意义的错误信息？请编写代码实现，并解释错误处理流程。

Answer 1

function fetchData() {
    return fetch('your-api-url')
      .then(response => {
            if (!response.ok) {
                throw new Error(`HTTP error! status: ${response.status}`);
            }
            return response.json();
        })
      .catch(error => {
            if (error.name === 'SyntaxError') {
                return Promise.reject(new Error('解析响应数据时出错'));
            }
            return Promise.reject(new Error('网络请求过程中发生错误: ' + error.message));
        });
}

// 使用示例
fetchData()
  .then(data => {
        console.log(data);
    })
  .catch(error => {
        console.error(error.message);
    });

错误处理流程解释：

1. 网络请求阶段：fetch返回的Promise在网络请求失败（如网络连接问题）时会被拒绝，catch块捕获到这个错误，并重新抛出一个带有更有意义信息的错误，表明是网络请求过程中的错误。
2. HTTP状态码检查：当请求成功到达服务器并返回响应时，通过response.ok检查HTTP状态码。如果状态码不是200（即response.ok为false），手动抛出一个错误，包含具体的HTTP状态码信息。
3. 数据解析阶段：response.json()用于将响应数据解析为JSON格式。如果解析过程中出错（例如返回的数据格式不正确），会抛出一个SyntaxError。catch块捕获到这个错误后，重新抛出一个表明解析响应数据出错的错误。
4. 调用者接收：调用fetchData函数的代码通过.catch捕获可能发生的各种错误，并可以根据error.message获取有意义的错误信息进行处理。