深入理解ES6 011【學習筆記】

Promise 與非同步程式設計

因為執行引擎是單執行緒的,所以需要追蹤即將執行的程式碼,那些程式碼被放在一個任務佇列中,每當一段程式碼準備執行時,都會被新增到任務佇列中,每當引擎中的一段程式碼結束執行,事件迴圈會執行佇列中的下一個任務。

Promise相當於非同步操作結果佔位符,它不會去訂閱一個事件,也不會傳遞一個回呼函式給目標函式,而是讓函式回傳一個 Promise,就像這樣

// readFile 承諾在未來的某個時刻完成
let promise = readFile('txx.txt')

Promise 的生命週期

  • pending
  • fulfilled 成功
  • rejected 程式錯誤或其他原因

[[PromiseState]]內部屬性被用來表示 Promise 的三種狀態,這個屬性不暴露於 Promise 物件上,所以不能以程式設計的方式偵測 Promise 的狀態,只有當 Promise 狀態改變時,透過 then() 方法來採取特定的行為。所以 Promise 都有 then 方法,它接受兩個參數,fulfilled 和 rejected 時的兩個回呼函式

如果一個物件實作了上述的 then 方法,那這個物件我們就稱之為 thenable 物件,所有的 Promise 物件都是 thenable 物件,但並非所有 thenable 物件都是 Promise。

let promise = readFile("example.txt");
promise.then(function(contents){
  // 完成
},function(err){
  // 拒絕
})
promise.then(function(contents){
  // 完成
})

promise.then(null,function(err){
  // 拒絕
})
// catch等同於上面這種
promise.catch(function(err){
  // 拒絕
})

如果向 Promise.resolve() 方法或 Promise.reject() 方法傳入一個 Promise,那麼這個 Promise 會被直接回傳

Node.js 環境的拒絕處理

  • unhandledRejection
  • rejectionHandled
let rejected;
process.on("unhandledRejection",function(reason,promise){
  console.log(reason.message); // "Explosin"
  console.log(rejected === promise); // "Explosin"
})
rejected = Promise.reject(new Error('Explosin'))

串聯 Promise 及鏈式回傳值

let p1 = new Promise(function(resolve,reject){
  resolve(42)
})
p1.then(function(value){
  console.log(value)
  return value+1;
})
.then(function(value){
  console.log(value); // "43"
})

let p1 = new Promise(function(resolve,reject){
  reject(42)
})
p1.catch(function(value){
  console.log(value) // 42
  return value+1;
})
.then(function(value){
  console.log(value); // "43"
})

在 Promise 鏈回傳 Promise

Promise.all()

只接受一個參數並回傳一個 Promise,該參數是一個含有多個受監測 Promise 的可迭代物件,只有當可迭代物件中所有 Promise 都被解決後,回傳的 Promise 才會被解決,只有當可迭代物件中所有 Promise 都完成後,回傳的 Promise 才會被完成。只要有一個 reject,就不用等所有的都完成就會被 reject。

let p1 = new Promise(function(resolve,reject){
  resolve(42)
})
let p2 = new Promise(function(resolve,reject){
  reject(43)
})
let p3 = new Promise(function(resolve,reject){
  resolve(44)
})
let p4 =  Promise.all([p1,p2,p3])
p4.catch(function(value){
  console.log(Array.isArray(value)); //false
  console.log(value); // 43
})

Promise.race()

只要有一個 resolve,不用等所有的都被完成。一旦陣列中的某個 Promise 被完成,Promise.race() 方法也會像 Promise.all() 方法一樣回傳一個特定的 Promise

Promise 繼承

class MyPromise extends Promise {
  // 使用預設的建構函式

  success(resolove,reject){
    return this.then(resolove,reject)
  }
  failure(reject){
    return this.catch(reject)
  }
}
let promise = new MyPromise(function(resolve,reject){
  resolve(42)
})
promise.success(function(value){
  console.log(value) // 42
})
.failure(function(value){
  console.log(value)
})

基於 Promise 的非同步任務執行

改造之前的文件讀取功能。只要每個非同步操作都回傳 Promise,就可以極大地簡化並能實用化這個過程。以 Promise 作為通用介面用於所有非同步程式碼可以簡化任務執行器。

let fs = require("fs");

function run(taskDef){
  // 建立迭代器
  let task = taskDef()

  // 開始執行任務
  let result = task.next();

  // 遞迴函式遍歷
  (function step(){
    // 如果有更多任務要做
    if(!result.done){
      // 用一個 Promise 來解決會簡化問題
      let promise = Promise.resolove(result.value);
      promise.then(function(value){
        result = task.next(value);
        step()
      })
      .catch(function(error){
        result = task.throw(error);
        step();
      })
    }

  }())
}
// 定義一個可用於任務執行器的函式
function readFile(filename){
  return new Promise(function(resolove,reject){
    fs.readFile(filename,function(err,contents){
      if(err){
        reject(err);
      } else {
        resolove(contents)
      }
    })
  })
}

// 執行一個任務
run(function *(){
  let contents = yield readFile("config.json");
  doSomethingWith(contents);
  console.log("Done")
})

主題測試文章,只做測試使用。發佈者:Walker,轉轉請注明出處:https://walker-learn.xyz/archives/4337

(0)
Walker的頭像Walker
上一篇 2026年3月10日 00:00
下一篇 2026年3月8日 15:40

相關推薦

  • Node深入淺出(聖思園教育) 001【學習筆記】

    node 從非同步程式設計典範理解 Node.js Node.js 的定位與核心思想 基於 V8 引擎 + libuv 事件驅動函式庫,將 JavaScript 從瀏覽器帶到伺服器端。 採用單執行緒事件迴圈處理 I/O,最大化利用 CPU 等待 I/O 的時間切片,特別適合高併發、I/O 密集型情境。 「不要阻塞主執行緒」是設計哲學:盡量把耗時操作交給核心或執行緒池,回呼結果…

    個人 2025年11月24日
    34300
  • Go工程師體系課 006【學習筆記】

    專案結構說明:user-web 模組 user-web 是 joyshop_api 專案中的使用者服務 Web 層模組,負責處理使用者相關的 HTTP 請求、參數驗證、業務路由以及呼叫後端介面等功能。以下是目錄結構說明: user-web/ ├── api/ # 控制器層,定義業務介面處理邏輯 ├── config/ # 配置模組,包含系統配置結構體及讀取邏輯 …

    個人 2025年11月25日
    28700
  • TS珠峯 004【學習筆記】

    類型體操 type-1 // 內建 // Partial Required Readonly 修飾類型的 // Pick Omit 處理資料結構 // Exclude Extract 處理集合類型的 // Parameters ReturnType infer // 字串類型,樣板字串`${}` + infer PartialPropsOptional …

    個人 2025年3月27日
    1.4K00
  • Go工程師體系課 003【學習筆記】

    grpc grpc grpc-go grpc 無縫整合了 protobuf protobuf 習慣用 Json、XML 資料儲存格式的你們,相信大多都沒聽過 Protocol Buffer。 Protocol Buffer 其實是 Google 出品的一種輕量且高效的結構化資料儲存格式,效能比 Json、XML 真的強!太!多! protobuf…

    個人 2025年11月25日
    25300
  • 熱愛運動,挑戰極限,擁抱自然

    熱愛 在這個快節奏的時代,我們被工作、生活的壓力所包圍,常常忽略了身體的需求。而運動,不只是一種健身方式,更是一種釋放自我、挑戰極限、與自然共舞的生活態度。無論是滑雪、攀岩、衝浪,還是跑步、騎行、瑜伽,每一種運動都能讓我們找到內心的激情,感受到生命的躍動。 運動是一場自我挑戰。挑戰極限,不只是職業運動員的專屬,而是每一個熱愛運動的人都可以追求的目標。它可…

    個人 2025年2月26日
    1.4K00
簡體中文 繁體中文 English