Promise的then/catch方法詳解

一、基本概念與用法

Promise 是非同步編程的一種解決方案，它是一個對象，可以處理非同步任務的狀態（pending/fulfilled/rejected）及其對應的結果。在使用 Promise 進行非同步編程時，我們通常通過調用它的 then 方法來獲取其狀態改變時的結果，並通過 catch 方法捕獲非同步任務拋出的異常。Promise 的典型用法如下：

var promise = new Promise(function(resolve, reject) {
  // 非同步任務...
  if (/* 非同步操作成功 */) {
    resolve(result);
  } else {
    reject(error);
  }
});

promise.then(function(result) {
  // 非同步操作成功時的回調
}).catch(function(error) {
  // 非同步操作失敗時的回調
});

Promise 的構造函數傳入一個回調函數，該回調函數中包含非同步操作的三個狀態之一：成功、失敗、未完成。由於非同步任務的執行時間不確定，我們無法確定 Promise 對象何時變為成功或失敗狀態，因此需要通過 then/catch 方法來獲取其狀態。

二、then 方法詳解

1、then 方法的基本用法

then 方法接收兩個回調函數作為參數，分別用來處理非同步任務成功時和失敗時的情況。如果 Promise 對象的狀態變為成功，則調用第一個回調函數；如果 Promise 對象的狀態變為失敗，則調用第二個回調函數。then 方法的基本用法如下：

promise.then(function(result) {
  // 非同步操作成功時的回調
}, function(error) {
  // 非同步操作失敗時的回調
});

以下是通過 then 方法的基本用法來實現非同步任務的代碼示例：

var promise = new Promise(function(resolve, reject) {
  // 非同步任務...
  if (/* 非同步操作成功 */) {
    resolve(result);
  } else {
    reject(error);
  }
});

promise.then(function(result) {
  // 非同步操作成功時的回調
  console.log(result);
}, function(error) {
  // 非同步操作失敗時的回調
  console.log(error);
});

2、then 方法的鏈式調用

then 方法不僅可以在一個 Promise 對象上執行一次，也可以鏈式調用多個 then 方法，按順序處理多個非同步任務的結果。鏈式調用的原理是將 then 的返回值轉變為一個新的 Promise 對象，該 Promise 對象的狀態與 then 方法的返回值有關。如果 then 方法內返回的是一個 Promise 對象，則鏈式調用後面的 then 方法會等待它的狀態改變。如果 then 方法內返回的是一個非 Promise 對象的值，則鏈式調用後面的 then 方法會立即執行，並且其參數接收的就是這個非 Promise 對象的值。鏈式調用的基本用法如下：

promise.then(function(result) {
  // 非同步操作成功時的回調
  return result1; // 注意這裡返回值是一個非 Promise 對象的值
}).then(function(result1) {
  // result1 是 then 方法中返回的值
}).catch(function(error) {
  // 非同步操作失敗時的回調
});

以下是通過 then 方法的鏈式調用來實現多個非同步任務依次執行的代碼示例：

var promise = new Promise(function(resolve, reject) {
  // 非同步任務...
  if (/* 非同步操作成功 */) {
    resolve(result);
  } else {
    reject(error);
  }
});

promise.then(function(result) {
  // 非同步操作成功時的回調
  return result1;
}).then(function(result1) {
  // result1 是 then 方法中返回的值
  return result2;
}).then(function(result2) {
  // result2 是 then 方法中返回的值
}).catch(function(error) {
  // 非同步操作失敗時的回調
});

三、catch 方法詳解

在鏈式調用多個 then 方法時，如果其中某個 then 方法拋出異常，則 promise 對象會立即調用 catch 方法中的回調函數。catch 方法的主要作用是捕獲鏈式調用中的異常並進行處理，以保證 Promise 對象最終都會被處理，不會出現 uncaught exception 或 promise 中斷的情況。catch 方法的基本用法如下：

promise.catch(function(error) {
  // 非同步操作失敗時的回調
});

以下是通過 catch 方法來處理錯誤的代碼示例：

var promise = new Promise(function(resolve, reject) {
  // 非同步任務...
  if (/* 非同步操作成功 */) {
    resolve(result);
  } else {
    reject(error);
  }
});

promise.then(function(result) {
  // 非同步操作成功時的回調
  return result1;
}).then(function(result1) {
  // result1 是 then 方法中返回的值
  return result2;
}).then(function(result2) {
  // result2 是 then 方法中返回的值
}).catch(function(error) {
  // 捕獲鏈式調用中的異常並進行處理
});

四、小結

通過以上的介紹，我們可以看出，Promise 對象以其簡單的 API 和強大的功能在非同步編程中發揮著重要的作用。通過 then 方法的鏈式調用，我們可以方便地依次處理多個非同步任務的結果，而 catch 方法則可以保證 Promise 對象在出現異常時不會中斷程序運行，而是進行錯誤處理。同時，我們應該注意 Promise 對象中包含的非同步操作必須是非阻塞的，否則無法發揮其真正的非同步特性。