一、在Promise里，如果resolve和reject同時存在，且沒有條件約束（同步調(diào)用），或者有條件約束（異步/條件判斷），它們的執(zhí)行順序是怎樣的？

1.resolve和reject同級，且沒有條件約束（同步調(diào)用）

示例代碼：

new Promise((resolve, reject) => {
    resolve("成功"); // (A)
    reject("失敗");  // (B)
}).then(
    (res) => console.log("then:", res),
    (err) => console.log("catch:", err)
);

執(zhí)行順序：

1. resolve("成功") (A) 先執(zhí)行，Promise 狀態(tài)變?yōu)?nbsp;fulfilled。

2. reject("失敗") (B) 也會執(zhí)行，但由于 Promise 狀態(tài)已經(jīng)變成 fulfilled，它會被 忽略。

3. 最終進(jìn)入 .then() 的成功回調(diào)，輸出 "then: 成功"。

結(jié)論：

? resolve 先執(zhí)行，reject 被忽略（因?yàn)?nbsp;Promise 狀態(tài)一旦改變就不能再變）。

2.resolve和reject有條件約束（異步/條件判斷）

(1) 異步任務(wù)（如setTimeout）決定執(zhí)行順序

示例代碼：

new Promise((resolve, reject) => {
    setTimeout(() => resolve("成功"), 1000); // (A) 1秒后執(zhí)行
    setTimeout(() => reject("失敗"), 500);  // (B) 0.5秒后執(zhí)行
}).then(
    (res) => console.log("then:", res),
    (err) => console.log("catch:", err)
);

執(zhí)行順序：

1. reject("失敗") (B) 先執(zhí)行（500ms < 1000ms），Promise 狀態(tài)變?yōu)?nbsp;rejected。

2. resolve("成功") (A) 1秒后執(zhí)行，但 Promise 已經(jīng)是 rejected，所以它被 忽略。

3. 最終進(jìn)入 .then() 的失敗回調(diào)，輸出 "catch: 失敗"。

結(jié)論：

? 先執(zhí)行的（reject）生效，后執(zhí)行的（resolve）被忽略。

(2) 條件判斷（如if-else）決定執(zhí)行順序

示例代碼：

let condition = true;

new Promise((resolve, reject) => {
    if (condition) {
        resolve("成功"); // (A) 執(zhí)行
    } else {
        reject("失敗");  // (B) 不執(zhí)行
    }
}).then(
    (res) => console.log("then:", res),
    (err) => console.log("catch:", err)
);

執(zhí)行順序：

1. condition 為 true，所以 resolve("成功") (A) 執(zhí)行，Promise 狀態(tài)變?yōu)?nbsp;fulfilled。

2. reject("失敗") (B) 不會執(zhí)行。

3. 最終進(jìn)入 .then() 的成功回調(diào)，輸出 "then: 成功"。

結(jié)論：

? 條件決定哪個先執(zhí)行，另一個不會執(zhí)行。

總結(jié)

核心規(guī)則

1. Promise 的狀態(tài)一旦改變（fulfilled/rejected），就不能再變。

2. 同步代碼中，resolve 和 reject 誰在前誰生效。

3. 異步代碼中，取決于哪個回調(diào)先執(zhí)行。

4. 條件約束下，滿足條件的執(zhí)行，另一個不執(zhí)行。

二、在Promise鏈?zhǔn)秸{(diào)用（.then()）的情況下，后續(xù)是否還會執(zhí)行resolve或reject取決于前一個Promise的狀態(tài)以及.then()回調(diào)的返回值。

1..then()的基本行為

.then() 會返回一個新的 Promise，它的狀態(tài)由它的回調(diào)函數(shù)決定：

• 如果回調(diào) 正常返回一個值（或沒有 return），新的 Promise 會 resolve 這個值。

• 如果回調(diào) 拋出錯誤（throw）或返回一個 rejected Promise，新的 Promise 會 reject。

示例 1：.then()返回普通值

new Promise((resolve) => resolve("A"))
  .then((res) => {
    console.log(res); // "A"
    return "B"; // ? 相當(dāng)于 resolve("B")
  })
  .then((res) => {
    console.log(res); // "B"
  });

執(zhí)行流程：

1. 第一個 Promise resolve("A")。

2. 第一個 .then() 接收 "A"，并返回 "B"（相當(dāng)于 resolve("B")）。

3. 第二個 .then() 接收 "B"。

示例 2：.then()拋出錯誤

new Promise((resolve) => resolve("A"))
  .then((res) => {
    console.log(res); // "A"
    throw new Error("Oops!"); // ? 相當(dāng)于 reject(Error("Oops!"))
  })
  .then(
    (res) => console.log("成功", res), // 不會執(zhí)行
    (err) => console.log("失敗", err)  // 捕獲錯誤："失敗 Error: Oops!"
  );

執(zhí)行流程：

1. 第一個 Promise resolve("A")。

2. 第一個 .then() 拋出錯誤，導(dǎo)致新的 Promise reject。

3. 第二個 .then() 的失敗回調(diào)捕獲錯誤。

2. 后續(xù)是否還能執(zhí)行resolve或reject？

情況 1：.then()返回新的Promise

如果 .then() 返回一個新的 Promise，那么它的 resolve/reject 會影響后續(xù)的鏈?zhǔn)秸{(diào)用。

示例：

new Promise((resolve) => resolve("A"))
  .then((res) => {
    console.log(res); // "A"
    return new Promise((resolve, reject) => {
      setTimeout(() => resolve("B"), 1000); // 1秒后 resolve("B")
    });
  })
  .then((res) => {
    console.log(res); // "B"（1秒后打?。?
  });

執(zhí)行流程：

1. 第一個 Promise resolve("A")。

2. 第一個 .then() 返回一個新的 Promise，1秒后 resolve("B")。

3. 第二個 .then() 等待這個 Promise 完成，最終接收 "B"。

情況 2：.then()內(nèi)部再次調(diào)用resolve/reject

如果 .then() 內(nèi)部手動創(chuàng)建 Promise 并調(diào)用 resolve/reject，會影響后續(xù)流程。

示例：

new Promise((resolve) => resolve("A"))
  .then((res) => {
    console.log(res); // "A"
    return new Promise((resolve, reject) => {
      resolve("B"); // ? 手動 resolve
      reject("Error"); // ? 會被忽略（Promise 狀態(tài)已改變）
    });
  })
  .then(
    (res) => console.log("成功", res), // "成功 B"
    (err) => console.log("失敗", err)
  );

執(zhí)行流程：

1. 第一個 Promise resolve("A")。

2. 第一個 .then() 返回一個新的 Promise，并立即 resolve("B")，reject("Error") 被忽略。

3. 第二個 .then() 接收 "B"。

3. 關(guān)鍵結(jié)論

1. .then() 會返回一個新的 Promise，它的狀態(tài)由回調(diào)決定：

   • 如果回調(diào)返回普通值 → 新 Promise resolve 該值。

   • 如果回調(diào)拋出錯誤 → 新 Promise reject 該錯誤。

   • 如果回調(diào)返回 Promise → 新 Promise 跟隨它的狀態(tài)。

2. 后續(xù)的 resolve/reject 由 .then() 的回調(diào)決定，而不是最初的那個 Promise。

3. Promise 狀態(tài)一旦改變就不能再變，所以如果 resolve 和 reject 同時出現(xiàn)，先執(zhí)行的生效，后執(zhí)行的被忽略。

4.總結(jié)

核心規(guī)則：

1. Promise 鏈?zhǔn)秸{(diào)用的每一步都是一個新的 Promise。

2. 后續(xù)的 resolve/reject 由 .then() 或 .catch() 的回調(diào)決定。

3. 一旦 Promise 狀態(tài)改變，就不能再變，所以 resolve 和 reject 不會沖突。

三、即使Promise被reject，仍然可以繼續(xù)調(diào)用.then()或.catch()，但執(zhí)行邏輯有所不同。關(guān)鍵在于Promise的鏈?zhǔn)秸{(diào)用如何處理rejected狀態(tài)。

1.reject后如何繼續(xù)調(diào)用？

(1) 使用.catch()捕獲錯誤

.catch() 專門用于處理 rejected 狀態(tài)的 Promise，類似于 try/catch。
示例：

new Promise((resolve, reject) => {
    reject("失敗"); // ? Promise 被 reject
})
.then((res) => {
    console.log("成功:", res); // 不會執(zhí)行
})
.catch((err) => {
    console.log("捕獲錯誤:", err); // 輸出："捕獲錯誤: 失敗"
    return "錯誤已處理"; // ? 返回一個新值，相當(dāng)于 resolve("錯誤已處理")
})
.then((res) => {
    console.log("后續(xù)處理:", res); // 輸出："后續(xù)處理: 錯誤已處理"
});

執(zhí)行流程：

1. Promise 被 reject("失敗")。

2. 第一個 .then() 被跳過（因?yàn)?nbsp;Promise 是 rejected 狀態(tài)）。

3. .catch() 捕獲錯誤，并返回一個新值（相當(dāng)于 resolve("錯誤已處理")）。

4. 后續(xù)的 .then() 接收到 "錯誤已處理"。

(2) 使用.then()的第二個參數(shù)（錯誤回調(diào)）

.then() 可以接受兩個參數(shù)：

• 第一個參數(shù)：onFulfilled（成功回調(diào)）。

• 第二個參數(shù)：onRejected（失敗回調(diào)）。
  示例：

new Promise((resolve, reject) => {
    reject("失敗"); // ? Promise 被 reject
})
.then(
    (res) => console.log("成功:", res), // 不會執(zhí)行
    (err) => {
        console.log("失敗回調(diào):", err); // 輸出："失敗回調(diào): 失敗"
        return "從錯誤中恢復(fù)"; // ? 返回一個新值，相當(dāng)于 resolve("從錯誤中恢復(fù)")
    }
)
.then((res) => {
    console.log("后續(xù)處理:", res); // 輸出："后續(xù)處理: 從錯誤中恢復(fù)"
});

執(zhí)行流程：

1. Promise 被 reject("失敗")。

2. .then() 的第二個參數(shù)（錯誤回調(diào)）被執(zhí)行，并返回 "從錯誤中恢復(fù)"。

3. 后續(xù)的 .then() 接收到 "從錯誤中恢復(fù)"。

2. 關(guān)鍵區(qū)別：.catch()vs.then()的第二個參數(shù)

推薦使用 .catch()，因?yàn)樗湘準(zhǔn)秸{(diào)用的習(xí)慣，且能捕獲前面所有 .then() 中的錯誤。

3. 如果既不.catch()也不傳錯誤回調(diào)？

如果 reject 后沒有錯誤處理，控制臺會報 Uncaught (in promise) 警告，但后續(xù) .then() 仍會執(zhí)行（只是接收不到 reject 的值）。

示例：

new Promise((resolve, reject) => {
    reject("失敗"); // ? 未捕獲的錯誤
})
.then((res) => {
    console.log("成功:", res); // 不會執(zhí)行
})
.then((res) => {
    console.log("仍然執(zhí)行，但 res=", res); // 輸出："仍然執(zhí)行，但 res= undefined"
});

執(zhí)行結(jié)果：

1. 控制臺警告：Uncaught (in promise) 失敗。

2. 最后一個 .then() 仍然執(zhí)行，但 res 是 undefined（因?yàn)闆]有前一步的返回值）。

4. 總結(jié)

最終建議：

在鏈?zhǔn)秸{(diào)用中，始終用 .catch() 處理錯誤，避免未捕獲的 Promise 錯誤！

到此這篇關(guān)于JS中new Promise的resolve和reject執(zhí)行順序的文章就介紹到這了,更多相關(guān)JS resolve和reject執(zhí)行順序內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論