Promise 构造函数中的异常为何不会阻止脚本的继续执行？

本文旨在解释 Promise 构造函数中抛出异常时，为何脚本会继续执行，而不是像同步代码那样立即停止。我们将深入探讨 Promise 的内部机制，并通过模拟 Promise 构造函数的简化实现来阐明错误处理流程，帮助读者理解 Promise 如何捕获并处理异常，从而保证程序的健壮性。

在 JavaScript 中，Promise 构造函数用于创建 Promise 对象，它接受一个 executor 函数作为参数。这个 executor 函数会立即同步执行。当 executor 函数内部发生错误时，很多人可能会期望脚本立即停止执行。然而，实际上，脚本会继续执行，这是因为 Promise 内部实现了错误捕获机制。

让我们通过一个例子来理解这个问题：

console.log('first');
const promise1 = new Promise((resolve, reject) => {
  console.log('inside executor');
  let what = 1;
  console.log(what()); // 抛出 TypeError
  console.log('not reached');
  resolve('Hi Guys!');
});
console.log('continues');

这段代码的输出如下：

first
inside executor
continues
Uncaught (in promise) TypeError: what is not a function
    at :4:15

可以看到，尽管 what() 抛出了 TypeError，但 console.log('continues') 仍然被执行了。这是因为 Promise 内部捕获了 executor 函数中的错误，并将 Promise 的状态设置为 rejected。

Promise 的内部错误处理机制

为了更好地理解 Promise 的错误处理机制，我们可以参考 ECMAScript 规范中关于 Promise 构造函数 的描述。简而言之，当 executor 函数执行过程中发生错误时，Promise 会捕获这个错误，并将 Promise 的状态设置为 rejected，但不会阻止脚本的继续执行。

以下是一个简化的 Promise 构造函数实现，可以帮助我们理解其内部机制：

class MyPromise {
    #state
    #resolvedValue
    #customers

    constructor(executor) {
        this.#state = "pending";
        this.#customers = [];
        try {
             executor((value) => this.#resolve(value), 
                      (reason) => this.#reject(reason));
        } catch(err) {
             // 捕获错误，并允许执行继续
             this.#reject(err); 
        }
    }

    #reject(reason) {
        if (this.#state !== "pending") return;
        this.#state = "rejected";
        this.#resolvedValue = reason;
        this.#broadcast(); // 异步调用 then/catch 回调
    }

    #resolve(value) {
        if (this.#state !== "pending") return;
        this.#state = "fulfilled";
        this.#resolvedValue = value;
        this.#broadcast();
    }

    then(onFulfilled, onRejected) {
        return new MyPromise((resolve, reject) => {
            this.#customers.push({
                onFulfilled: onFulfilled ? (value) => {
                    try {
                        const result = onFulfilled(value);
                        resolve(result);
                    } catch (err) {
                        reject(err);
                    }
                } : resolve,
                onRejected: onRejected ? (reason) => {
                    try {
                        const result = onRejected(reason);
                        resolve(result);
                    } catch (err) {
                        reject(err);
                    }
                } : reject,
                resolve,
                reject
            });
            if (this.#state !== "pending") {
                this.#broadcast();
            }
        });
    }

    catch(onRejected) {
        return this.then(null, onRejected);
    }

    #broadcast() {
        if (this.#state === "pending") return;

        this.#customers.forEach(customer => {
            if (this.#state === "fulfilled") {
                customer.onFulfilled(this.#resolvedValue);
            } else {
                customer.onRejected(this.#resolvedValue);
            }
        });
        this.#customers = [];
    }
}

在这个简化的实现中，constructor 函数使用 try...catch 块来捕获 executor 函数中可能抛出的错误。如果发生错误，catch 块会调用 #reject 方法，将 Promise 的状态设置为 rejected，并将错误信息存储起来。

如何处理 Promise 中的错误

虽然 Promise 构造函数中的异常不会阻止脚本的继续执行，但我们仍然需要处理这些错误。通常，我们使用 catch 方法来捕获 Promise 的 rejected 状态：

console.log('first');
const promise1 = new Promise((resolve, reject) => {
  console.log('inside executor');
  let what = 1;
  console.log(what());
  console.log('not reached');
  resolve('Hi Guys!');
}).catch(error => {
  console.error('Error caught:', error);
});
console.log('continues');

在这个例子中，catch 方法会捕获 TypeError，并将其打印到控制台。

总结

Promise 构造函数中的异常不会阻止脚本的继续执行，这是因为 Promise 内部实现了错误捕获机制。为了处理 Promise 中的错误，我们可以使用 catch 方法。理解 Promise 的错误处理机制对于编写健壮的 JavaScript 代码至关重要。通过捕获并处理 Promise 中的错误，我们可以避免程序崩溃，并提供更好的用户体验。