try...catch和.then().catch()

try...catch：通常用于 同步 代码

.then().catch()：通常用于 异步 代码

区别（捕捉什么样的错误）

try...catch

1.显式抛出的错误：

try {
    throw new Error("这是一个显式抛出的错误！");
} catch (error) {
    console.error("捕获到错误:", error.message);
}

2.运行时错误：

try {
    let x = y; // y 未定义，将抛出 ReferenceError
} catch (error) {
    console.error("捕获到错误:", error.message); // "y is not defined"
}

3.函数方法异常抛出的错误

4.Promise拒绝

虽然try...catch不能直接捕获Promise拒绝的错误，但使用async/await语法时，await表达式会暂停async函数的执行，等待Promise解决（fulfilled）或拒绝（rejected）。

如果Promise被拒绝，并且这个await表达式位于try块中，那么catch块将能够捕获到这个错误。

.then().catch()

.then().catch()是Promise对象提供的错误处理机制。

这种机制专门用于处理异步操作中可能发生的错误。

1.Promise错误

当Promise对象的状态从“pending”（进行中）变为“rejected”（已拒绝）时，

.catch()方法会捕获到这个拒绝状态及其附带的原因（通常是一个错误对象或拒绝值）。

这个拒绝可以由Promise内部的异步操作（如网络请求失败、文件读取错误等）引发。

fn()
    .then(response => {
        // 处理成功响应
    })
    .catch(error => {
        // 捕获并处理Promise拒绝的错误
        console.error("捕获到Promise拒绝的错误:", error);
    });

2.在.then()中抛出的错误：

fn()
    .then(response => {
        // 假设这里有一些代码抛出了错误
        throw new Error("在.then()中抛出的错误！");
    })
    .catch(error => {
        // 捕获.then()中抛出的错误
        console.error("捕获到.then()中的错误:", error.message);
    });

如果没有在Promise链的末尾添加.catch()方法，

并且Promise被拒绝，这个拒绝最终会被抛给全局的错误处理器（如window.onerror在浏览器中，或在Node.js中使用uncaughtException或unhandledRejection事件）。

这可能会导致程序崩溃。

可以通过使用async/await语法与try...catch结合来捕获axios请求中的错误。

当使用async关键字定义一个异步函数，并在该函数内部使用await来等待一个Promise（比如axios.get()或axios.post()的返回值）时，

如果Promise被拒绝（即请求失败或发生错误），可以使用try...catch来捕获这个错误。

try {
    const res = await axios.get('https://v1.jinrishici.com/sijia')
    console.log(res);
} catch (error) {
    console.log(error, 'try');
}

如果你使用async/await，而是直接使用Promise的.then()和.catch()方法，那么错误应该在.catch()方法中被捕获，而不是在try...catch中。

axios.get('https://v1.jinrishici.com/sijia').then(res => {
    console.log(res, 'then');
}).catch(error => {
    console.log(error, 'catch');
})

通常什么情况下会导致.then().catch()，然后走catch()

在JavaScript中，特别是当涉及到Promise和异步操作时。

1. Promise拒绝（Rejection）：
   • 最直接的情况是，Promise本身被拒绝。这可能是因为异步操作失败（例如，网络请求失败、文件读取错误等），或者Promise被显式地拒绝（通过Promise.reject()或throw语句在Promise执行器函数中）。
2. 在.then()中抛出的错误：
   • 如果在.then()方法的回调函数中抛出了错误（无论是显式使用throw语句还是由于运行时异常），这个错误会被后续的.catch()方法捕获。这是因为在Promise链中，每个.then()方法都返回一个新的Promise，该Promise的状态由回调函数的执行结果决定。
3. 链式调用中的错误传播：
   • 在Promise链中，如果某个.then()方法抛出了错误，并且后面没有紧接着的.catch()方法来捕获它，那么这个错误会沿着Promise链继续传播，直到找到一个.catch()方法为止。这意味着，即使错误是在链的某个中间部分抛出的，它也可以被链末端的.catch()捕获。
4. 异步操作中的错误：
   • 当.then()方法中的回调函数包含异步操作（如另一个Promise、setTimeout回调等），并且这些异步操作导致错误时，这个错误需要被适当地处理。如果异步操作本身返回一个Promise，并且这个Promise被拒绝，那么拒绝的原因会被传播到链中的下一个.catch()（如果有的话）。
5. 返回被拒绝的Promise：
   • 如果.then()方法中的回调函数返回了一个被拒绝的Promise，那么这个拒绝也会被传播到链中的下一个.catch()。
6. 解析响应失败：
   • 在某些情况下，即使服务器返回了一个看似有效的响应，但如果响应的格式不正确或无法被解析（例如，JSON解析失败），这也可能被视为一个错误，并触发.catch()。不过，这通常取决于.then()方法中的具体实现。

async/await语法处理异步代码和错误变得更加直观和易于理解。

使用async/await时，可以使用try...catch语句来捕获异步操作中的错误，这与处理同步代码中的错误非常相似。

通常什么情况下会导致axios请求错误，然后走catch()

在使用axios进行HTTP请求时，有多种情况可能导致请求出错，并触发.catch()方法的执行。

1. 网络问题：
   • 请求无法发送到服务器，可能是因为网络连接中断、服务器不可达（如DNS解析失败）或防火墙阻止。
2. 服务器响应错误：
   • 服务器返回了一个状态码表示错误（如404未找到、500内部服务器错误等）。虽然这些不一定总是被视为“错误”（例如，404可能是一个正常的业务逻辑的一部分），但axios默认会将非2xx的状态码视为拒绝（rejection）并触发.catch()。
3. 请求超时：
   • 如果设置了请求超时（通过axios.create配置中的timeout选项或请求配置中的timeout属性），并且请求在指定时间内未完成，则请求会被取消，并触发.catch()。
4. 请求被取消：
   • 使用CancelToken或AbortController取消请求时，请求会被标记为取消，并触发.catch()。
5. 跨域问题（CORS）：
   • 如果浏览器因为跨域资源共享（CORS）策略而阻止了请求，可能会触发一个网络错误，导致.catch()被调用。
6. 请求配置错误：
   • 如果请求的配置不正确（如错误的URL、无效的请求头、不支持的请求方法等），服务器可能会拒绝请求，或者请求根本无法发送，导致.catch()被触发。
7. 解析响应失败：
   • 如果服务器返回了一个看似有效的响应，但axios在尝试解析响应数据（如JSON）时失败，这也可能被视为一个错误，并触发.catch()。
8. 客户端错误：
   • 在请求发送之前，如果客户端代码（如JavaScript）抛出异常，这可能会阻止请求的发送，并导致.catch()被调用（尽管在这种情况下，错误可能不是直接由axios抛出的，而是由调用axios的代码抛出的，并且可能需要在外部使用try...catch来捕获）。

当axios请求出错时，.catch()方法会接收到一个错误对象，该对象通常包含有关错误的详细信息。

通常什么情况下会导致try..catch，走catch()

在JavaScript中，try...catch语句用于捕获并处理在try代码块中运行时发生的错误。

1. 运行时异常：
   • 如果try块中的代码尝试执行非法操作，如访问未定义的变量、调用不存在的函数、执行类型不匹配的操作（如将字符串当作函数来调用），JavaScript引擎会抛出一个运行时异常。这个异常会被catch块捕获。
2. 显式抛出的错误：
   • 如果try块中的代码使用throw语句显式地抛出一个错误（无论是Error对象还是其他类型的值），这个错误也会被catch块捕获。
3. 异步回调中的错误（但需注意）：
   • 如果try块中包含异步操作（如setTimeout、setInterval的回调函数，或者Promise的.then()回调），并且这些回调中抛出了错误，这个错误不会被外部的catch块捕获，除非这些异步操作被包裹在另一个try...catch块中，或者使用async/await语法，并且await表达式位于外部的try块中。
4. Promise拒绝的错误（使用async/await时）：
   • 当使用async/await语法时，如果await表达式等待的Promise被拒绝，并且这个await表达式位于try块中，那么拒绝的原因（通常是一个错误对象）会被catch块捕获。
5. 语法错误：
   • 需要注意的是，语法错误（如拼写错误、缺少括号或分号等）在代码执行之前就会被JavaScript引擎检测到，并导致代码无法执行。这些错误不会被try...catch捕获，因为它们发生在代码解析阶段，而不是运行阶段。
6. 全局错误：
   • 某些全局错误（如脚本加载失败、内存不足导致的错误）可能不会被try...catch直接捕获，因为它们可能发生在JavaScript引擎的更高层次，或者由浏览器/Node.js环境处理。

应尽量将可能抛出错误的代码包裹在try...catch块中，避免程序崩溃。同时，对于异步代码使用（Promise的.catch()方法和async/await与try...catch结合使用）来捕获并处理错误。