成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

JS常用的幾種異步流程控制

Barry_Ng / 992人閱讀

摘要：雖然這個模式運行效果很不錯，但是如果嵌套了太多的回調(diào)函數(shù)，就會陷入回調(diào)地獄。當(dāng)需要跟蹤多個回調(diào)函數(shù)的時候，回調(diào)函數(shù)的局限性就體現(xiàn)出來了，非常好的改進了這些情況。

JavaScript引擎是基于單線程 (Single-threaded) 事件循環(huán)的概念構(gòu)建的，同一時刻只允許一個代碼塊在執(zhí)行，所以需要跟蹤即將運行的代碼，那些代碼被放在一個任務(wù)隊列 (job queue) 中，每當(dāng)一段代碼準(zhǔn)備執(zhí)行時，都會被添加到任務(wù)隊列中。每當(dāng)JavaScript引擎中的一段代碼結(jié)束執(zhí)行，時間循環(huán) (event loop) 會執(zhí)行隊列中的下一個任務(wù)，它是 JavaScript 引擎中的一段程序，負(fù)責(zé)監(jiān)控代碼執(zhí)行并管理任務(wù)隊列。

請記住，隊列中的任務(wù)會從第一個一直執(zhí)行到最后一個。

事件模型

JavaScript最基礎(chǔ)的異步編程形式（比如點擊事件、鍵盤事件）
直到事件觸發(fā)時才執(zhí)行處理程序

回調(diào)模式

回調(diào)模式與事件模型類似，異步代碼都會在未來的某個時間點執(zhí)行，而這的區(qū)別是回調(diào)模式中被調(diào)用的函數(shù)是作為參數(shù)傳入的。
Node.js讀取磁盤上的文件：

readFile("example.txt", function(err, contents) {
  if(err) {
    throw err
  }
  
  console.log(contents)
})

console.log("Hi!")

調(diào)用readFile函數(shù)后，console.log("Hi!")語句會立即執(zhí)行，當(dāng)readFile結(jié)束執(zhí)行的時候，會向任務(wù)隊列的末尾添加一個新任務(wù)，該任務(wù)包含回調(diào)函數(shù)及相應(yīng)的參數(shù)。

雖然這個模式運行效果很不錯，但是如果嵌套了太多的回調(diào)函數(shù)，就會陷入回調(diào)地獄。

當(dāng)需要跟蹤多個回調(diào)函數(shù)的時候，回調(diào)函數(shù)的局限性就體現(xiàn)出來了，Promise非常好的改進了這些情況。

Promise

Promise 對象是一個代理對象（代理一個值），被代理的值在Promise對象創(chuàng)建時可能是未知的。它允許你為異步操作的成功和失敗分別綁定相應(yīng)的處理方法（handlers）。 這讓異步方法可以像同步方法那樣返回值，但并不是立即返回最終執(zhí)行結(jié)果，而是一個能代表未來出現(xiàn)的結(jié)果的promise對象

一個 Promise有以下幾種狀態(tài):

pending: 初始狀態(tài)，既不是成功，也不是失敗狀態(tài)。
fulfilled: 意味著操作成功完成。
rejected: 意味著操作失敗。

pending 狀態(tài)的 Promise 對象可能觸發(fā)fulfilled 狀態(tài)并傳遞一個值給相應(yīng)的狀態(tài)處理方法，也可能觸發(fā)失敗狀態(tài)（rejected）并傳遞失敗信息。當(dāng)其中任一種情況出現(xiàn)時，Promise 對象的 then 方法綁定的處理方法（handlers ）就會被調(diào)用（then方法包含兩個參數(shù)：onfulfilled 和 onrejected，它們都是 Function 類型。當(dāng)Promise狀態(tài)為fulfilled時，調(diào)用 then 的 onfulfilled 方法，當(dāng)Promise狀態(tài)為rejected時，調(diào)用 then 的 onrejected 方法， 所以在異步操作的完成和綁定處理方法之間不存在競爭）。

因為 Promise.prototype.then 和 Promise.prototype.catch 方法返回promise 對象， 所以它們可以被鏈?zhǔn)秸{(diào)用。

var promise1 = new Promise(function(resolve, reject) {
  setTimeout(function() {
    resolve("foo");
  }, 300);
});

promise1.then(function(value) {
  console.log(value);
  // expected output: "foo"
});

console.log(promise1);
// expected output: [object Promise]
async/await

當(dāng)調(diào)用一個 async 函數(shù)時，會返回一個 Promise 對象。當(dāng)這個 async 函數(shù)返回一個值時，Promise 的 resolve 方法會負(fù)責(zé)傳遞這個值；當(dāng) async 函數(shù)拋出異常時，Promise 的 reject 方法也會傳遞這個異常值。

async 函數(shù)中可能會有 await 表達(dá)式，這會使 async 函數(shù)暫停執(zhí)行，等待 Promise 的結(jié)果出來，然后恢復(fù)async函數(shù)的執(zhí)行并返回解析值（resolved）。

注意， await 關(guān)鍵字僅僅在 async function中有效。如果在 async function函數(shù)體外使用 await ，你只會得到一個語法錯誤（SyntaxError）。

async function testAsync() {
    return "Hello";
}

const testResult = testAsync();
console.log(testResult); //Promise { "Hello" }

testAsync().then(v => {
    console.log(v);    // 輸出 Hello
});

//使用await
async function testAsnync1() {
    let result = await testAsync();
    console.log(result); // Hello
}
參考

Promise() | MDN
《深入理解ES6》

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/102118.html

相關(guān)文章

  • 2018年5月前端面試題

    摘要：在上家公司裸辭之后，經(jīng)過一段時間休整，月中下旬面試了一些公司，由于本人框架使用的是，所以面試題涉及到框架的都是，現(xiàn)將面試題整理一下列舉常用的特性。事件冒泡以及事件捕獲。其他前端分頁和后端分頁優(yōu)缺點。包含多個子節(jié)點及孫節(jié)點，遍歷。 在上家公司裸辭之后，經(jīng)過一段時間休整，5月中下旬面試了一些公司，由于本人框架使用的是vue，所以面試題涉及到框架的都是vue，現(xiàn)將面試題整理一下： es6 ...

    wwolf 評論0 收藏0

  • 2018年5月前端面試題

    摘要：在上家公司裸辭之后，經(jīng)過一段時間休整，月中下旬面試了一些公司，由于本人框架使用的是，所以面試題涉及到框架的都是，現(xiàn)將面試題整理一下列舉常用的特性。事件冒泡以及事件捕獲。其他前端分頁和后端分頁優(yōu)缺點。包含多個子節(jié)點及孫節(jié)點，遍歷。 在上家公司裸辭之后，經(jīng)過一段時間休整，5月中下旬面試了一些公司，由于本人框架使用的是vue，所以面試題涉及到框架的都是vue，現(xiàn)將面試題整理一下： es6 ...

    Lavender 評論0 收藏0

  • 一名【合格】前端工程師的自檢清單

    摘要：在他的重學(xué)前端課程中提到到現(xiàn)在為止，前端工程師已經(jīng)成為研發(fā)體系中的重要崗位之一。大部分前端工程師的知識，其實都是來自于實踐和工作中零散的學(xué)習(xí)。一基礎(chǔ)前端工程師吃飯的家伙，深度廣度一樣都不能差。 開篇 前端開發(fā)是一個非常特殊的行業(yè)，它的歷史實際上不是很長，但是知識之繁雜，技術(shù)迭代速度之快是其他技術(shù)所不能比擬的。 winter在他的《重學(xué)前端》課程中提到： 到現(xiàn)在為止，前端工程師已經(jīng)成為研...

    羅志環(huán) 評論0 收藏0

  • 一名【合格】前端工程師的自檢清單

    摘要：在他的重學(xué)前端課程中提到到現(xiàn)在為止，前端工程師已經(jīng)成為研發(fā)體系中的重要崗位之一。大部分前端工程師的知識，其實都是來自于實踐和工作中零散的學(xué)習(xí)。一基礎(chǔ)前端工程師吃飯的家伙，深度廣度一樣都不能差。開篇 前端開發(fā)是一個非常特殊的行業(yè)，它的歷史實際上不是很長，但是知識之繁雜，技術(shù)迭代速度之快是其他技術(shù)所不能比擬的。 winter在他的《重學(xué)前端》課程中提到： 到現(xiàn)在為止，前端工程師已經(jīng)成為研發(fā)體系...

    isaced 評論0 收藏0

  • 前端基礎(chǔ)

    摘要：談起閉包，它可是兩個核心技術(shù)之一異步基于打造前端持續(xù)集成開發(fā)環(huán)境本文將以一個標(biāo)準(zhǔn)的項目為例，完全拋棄傳統(tǒng)的前端項目開發(fā)部署方式，基于容器技術(shù)打造一個精簡的前端持續(xù)集成的開發(fā)環(huán)境。 這一次，徹底弄懂 JavaScript 執(zhí)行機制 本文的目的就是要保證你徹底弄懂javascript的執(zhí)行機制，如果讀完本文還不懂，可以揍我。 不論你是javascript新手還是老鳥，不論是面試求職，還是日...

    graf 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<