成人免费xxxxx在线视频软件_久久精品久久久_亚洲国产精品久久久_天天色天天色_亚洲人成一区_欧美一级欧美三级在线观看

探索Javascript異步編程

開發 前端
筆者在之前的一片博客中簡單的討論了Python和Javascript的異同,其實作為一種編程語言Javascript的異步編程是一個非常值得討論的有趣話題。

筆者在之前的一片博客中簡單的討論了Python和Javascript的異同,其實作為一種編程語言Javascript的異步編程是一個非常值得討論的有趣話題。

JavaScript 異步編程簡介

 

回調函數和異步執行

所謂的異步指的是函數的調用并不直接返回執行的結果,而往往是通過回調函數異步的執行。

我們先看看回調函數是什么:

  1. var fn = function(callback) {  
  2.     // do something here  
  3.     ...  
  4.     callback.apply(this, para);  
  5. };  
  6.  
  7. var mycallback = function(parameter) {  
  8.     // do someting in customer callback  
  9. };  
  10.  
  11. // call the fn with callback as parameter  
  12. fn(mycallback);  

回調函數,其實就是調用用戶提供的函數,該函數往往是以參數的形式提供的。回調函數并不一定是異步執行的。比如上述的例子中,回調函數是被同步執行的。大部分語言都支持回調,C++可用通過函數指針或者回調對象,Java一般也是使用回調對象。

在Javascript中有很多通過回調函數來執行的異步調用,例如setTimeout()或者setInterval()。

  1. setTimeout(function(){  
  2.     console.log("this will be exectued after 1 second!");  
  3. },1000);  

在以上的例子中,setTimeout直接返回,匿名函數會在1000毫秒(不一定能保證是1000毫秒)后異步觸發并執行,完成打印控制臺的操作。也就是說在異步操作的情境下,函數直接返回,把控制權交給回調函數,回調函數會在以后的某一個時間片被調度執行。那么為什么需要異步呢?為什么不能直接在當前函數中完成操作呢?這就需要了解Javascript的線程模型了。

Javascript線程模型和事件驅動

Javascript最初是被設計成在瀏覽器中輔助提供HTML的交互功能。在瀏覽器中都包含一個Javascript引擎,Javscript程序就運行在這個引擎之中,并且只有一個線程。單線程能都帶來很多優點,程序員們可以很開心的不用去考慮諸如資源同步,死鎖等多線程阻塞式編程所需要面對的惱人的問題。但是很多人會問,既然Javascript是單線程的,那它又如何能夠異步的執行呢?
 

這就需要了解到Javascript在瀏覽器中的事件驅動(event driven)機制。事件驅動一般通過事件循環(event loop)和事件隊列(event queue)來實現的。假定瀏覽器中有一個專門用于事件調度的實例(該實例可以是一個線程,我們可以稱之為事件分發線程event dispatch thread),該實例的工作就是一個不結束的循環,從事件隊列中取出事件,處理所有很事件關聯的回調函數(event handler)。注意回調函數是在Javascript的主線程中運行的,而非事件分發線程中,以保證事件處理不會發生阻塞。

Event Loop Code:

  1. while(true) {  
  2.  var event = eventQueue.pop();  
  3.  if(event && event.handler) {  
  4.      event.handler.execute(); // execute the callback in Javascript thread  
  5.  } else {  
  6.      sleep(); //sleep some time to release the CPU do other stuff  
  7.  }  
  8. }  

通過事件驅動機制,我們可以想象Javascript的編程模型就是響應一系列的事件,執行對應的回調函數。很多UI框架都采用這樣的模型(例如Java Swing)。

那為什要異步呢,同步不是很好么?

異步的主要目的是處理非阻塞,在和HTML交互的過程中,會需要一些IO操作(典型的就是Ajax請求,腳本文件加載),如果這些操作是同步的,就會阻塞其它操作,用戶的體驗就是頁面失去了響應。

綜上所述Javascript通過事件驅動機制,在單線程模型下,以異步回調函數的形式來實現非阻塞的IO操作。

 

Javascript異步編程帶來的挑戰

Javascript的單線程模型有很多好處,但同時也帶來了很多挑戰。

 

代碼可讀性

想象一下,如果某個操作需要經過多個非阻塞的IO操作,每一個結果都是通過回調,程序有可能會看上去像這個樣子。

  1. operation1(function(err, result) {  
  2.     operation2(function(err, result) {  
  3.         operation3(function(err, result) {  
  4.             operation4(function(err, result) {  
  5.                 operation5(function(err, result) {  
  6.                     // do something useful  
  7.                 })  
  8.             })  
  9.         })  
  10.     })  
  11. })  

我們稱之為意大利面條式(spaghetti)的代碼。這樣的代碼很難維護。這樣的情況更多的會發生在server side的情況下。

流程控制

異步帶來的另一個問題是流程控制,舉個例子,我要訪問三個網站的內容,當三個網站的內容都得到后,合并處理,然后發給后臺。代碼可以這樣寫:

  1. var urls = ['url1','url2','url3'];  
  2. var result = [];  
  3.  
  4. for (var i = 0, len = urls.length(); i < len; i++ ) {  
  5.     $.ajax({  
  6.         url: urls[i],  
  7.         context: document.body,  
  8.         success: function(){  
  9.           //do something on success  
  10.           result.push("one of the request done successfully");  
  11.           if (result.length === urls.length()) {  
  12.               //do something when all the request is completed successfully  
  13.           }  
  14.         }});  
  15. }  

上述代碼通過檢查result的長度的方式來決定是否所有的請求都處理完成,這是一個很丑陋方法,也很不可靠。

異常和錯誤處理

通過上一個例子,我們還可以看出,為了使程序更健壯,我們還需要加入異常處理。 在異步的方式下,異常處理分布在不同的回調函數中,我們無法在調用的時候通過try...catch的方式來處理異常, 所以很難做到有效,清楚。

 

更好的Javascript異步編程方式
 

“這是***的時代,也是最糟糕的時代”

為了解決Javascript異步編程帶來的問題,很多的開發者做出了不同程度的努力,提供了很多不同的解決方案。然而面對如此眾多的方案應該如何選擇呢?我們這就來看看都有哪些可供選擇的方案吧。

 

Promise

Promise 對象曾經以多種形式存在于很多語言中。這個詞***由C++工程師用在Xanadu 項目中,Xanadu 項目是Web 應用項目的先驅。隨后Promise 被用在E編程語言中,這又激發了Python 開發人員的靈感,將它實現成了Twisted 框架的Deferred 對象。

2007 年,Promise 趕上了JavaScript 大潮,那時Dojo 框架剛從Twisted框架汲取靈感,新增了一個叫做dojo.Deferred 的對象。也就在那個時候,相對成熟的Dojo 框架與初出茅廬的jQuery 框架激烈地爭奪著人氣和名望。2009 年,Kris Zyp 有感于dojo.Deferred 的影響力提出了CommonJS 之Promises/A 規范。同年,Node.js ***亮相。

在編程的概念中,future,promise,和delay表示同一個概念。Promise翻譯成中文是“承諾”,也就是說給你一個東西,我保證未來能夠做到,但現在什么都沒有。它用來表示異步操作返回的一個對象,該對象是用來獲取未來的執行結果的一個代理,初始值不確定。許多語言都有對Promise的支持。

Promise的核心是它的then方法,我們可以使用這個方法從異步操作中得到返回值,或者是異常。then有兩個可選參數(有的實現是三個),分別處理成功和失敗的情景。

  1. var promise = doSomethingAync()  
  2. promise.then(onFulfilled, onRejected)  

異步調用doSomethingAync返回一個Promise對象promise,調用promise的then方法來處理成功和失敗。這看上去似乎并沒有很大的改進。仍然需要回調。但是和以前的區別在于,首先異步操作有了返回值,雖然該值只是一個對未來的承諾;其次通過使用then,程序員可以有效的控制流程異常處理,決定如何使用這個來自未來的值。

對于嵌套的異步操作,有了Promise的支持,可以寫成這樣的鏈式操作:

  1. operation1().then(function (result1) {  
  2.     return operation2(result1)  
  3. }).then(function (result2) {  
  4.     return operation3(result2);  
  5. }).then(function (result3) {  
  6.     return operation4(result3);  
  7. }).then(function (result4) {  
  8.     return operation5(result4)  
  9. }).then(function (result5) {  
  10.     //And so on  
  11. });  

Promise提供更便捷的流程控制,例如Promise.all()可以解決需要并發的執行若干個異步操作,等所有操作完成后進行處理。

  1. var p1 = async1();  
  2. var p2 = async2();  
  3. var p3 = async3();  
  4. Promise.all([p1,p2,p3]).then(function(){  
  5.     // do something when all three asychronized operation finished  
  6. });  

對于異常處理,

  1. doA()  
  2.   .then(doB)  
  3.   .then(null,function(error){  
  4.       // error handling here  
  5.   })  

#p#

如果doA失敗,它的Promise會被拒絕,處理鏈上的下一個onRejected會被調用,在這個例子中就是匿名函數function(error){}。比起原始的回調方式,不需要在每一步都對異常進行處理。這生了不少事。

以上只是對于Promise概念的簡單陳述,Promise擁有許多不同規范建議(A,A+,B,KISS,C,D等),名字(Future,Promise,Defer),和開源實現。大家可以參考一下的這些鏈接。


如果你有選擇困難綜合癥,面對這么多的開源庫不知道如何決斷,先不要急,這還只是一部分,還有一些庫沒有或者不完全采用Promise的概念

 

Non-Promise

下面列出了其它的一些開源的庫,也可以幫助解決Javascript中異步編程所遇到的諸多問題,它們的解決方案各不相同,我這里就不一一介紹了。大家有興趣可以去看看或者試用一下。

 

Non-3rd Party

其實,為了解決Javascript異步編程帶來的問題,不一定非要使用Promise或者其它的開源庫,這些庫提供了很好的模式,但是你也可以通過有針對性的設計來解決。

比如,對于層層回調的模式,可以利用消息機制來改寫,假定你的系統中已經實現了消息機制,你的code可以寫成這樣:

  1. eventbus.on("init"function(){  
  2.     operationA(function(err,result){  
  3.         eventbus.dispatch("ACompleted");  
  4.     });  
  5. });  
  6.  
  7. eventbus.on("ACompleted"function(){  
  8.     operationB(function(err,result){  
  9.         eventbus.dispatch("BCompleted");  
  10.     });  
  11. });  
  12.  
  13. eventbus.on("BCompleted"function(){  
  14.     operationC(function(err,result){  
  15.         eventbus.dispatch("CCompleted");  
  16.     });  
  17. });  
  18.  
  19. eventbus.on("CCompleted"function(){  
  20.     // do something when all operation completed  
  21. });  

這樣我們就把嵌套的異步調用,改寫成了順序執行的事件處理。

更多的方式,請大家參考這篇文章,它提出了解決異步的五種模式:回調、觀察者模式(事件)、消息、Promise和有限狀態機(FSM)。

 

下一代Javscript對異步編程的增強

 

ECMAScript6

下一代的Javascript標準Harmony,也就是ECMAScript6正在醞釀中,它提出了許多新的語言特性,比如箭頭函數、類(Class)、生成器(Generator)、Promise等等。其中Generator和Promise都可以被用于對異步調用的增強。

Nodejs的開發版V0.11已經可以支持ES6的一些新的特性,使用node --harmony命令來運行對ES6的支持。

 

co、Thunk、Koa

koa是由Express原班人馬(主要是TJ)打造,希望提供一個更精簡健壯的nodejs框架。koa依賴ES6中的Generator等新特性,所以必須運行在相應的Nodejs版本上。
 

利用Generator、coThunk,可以在Koa中有效的解決Javascript異步調用的各種問題。

co是一個異步流程簡化的工具,它利用Generator把一層層嵌套的調用變成同步的寫法。

  1. var co = require('co');  
  2. var fs = require('fs');  
  3.  
  4. var stat = function(path) {  
  5.   return function(cb){  
  6.     fs.stat(path,cb);  
  7.   }  
  8. };  
  9.  
  10. var readFile = function(filename) {  
  11.   return function(cb){  
  12.     fs.readFile(filename,cb);  
  13.   }  
  14. };  
  15.  
  16. co(function *() {  
  17.   var stat = yield stat('./README.md');  
  18.   var content = yield readFile('./README.md');  
  19. })();  

通過co可以把異步的fs.readFile當成同步一樣調用,只需要把異步函數fs.readFile用閉包的方式封裝。

利用Thunk可以進一步簡化為如下的code, 這里Thunk的作用就是用閉包封裝異步函數,返回一個生成函數的函數,供生成器來調用。

  1. var thunkify = require('thunkify');  
  2. var co = require('co');  
  3. var fs = require('fs');  
  4.  
  5. var stat = thunkify(fs.stat);  
  6. var readFile = thunkify(fs.readFile);  
  7.  
  8. co(function *() {  
  9.   var stat = yield stat('./README.md');  
  10.   var content = yield readFile('./README.md');  
  11. })();  

利用co可以串行或者并行的執行異步調用。

串行

  1. co(function *() {  
  2.   var a = yield request(a);  
  3.   var b = yield request(b);  
  4. })();  

并行

  1. co(function *() {  
  2.  var res = yield [request(a), request(b)];  
  3. })();  

更多詳細的內容,大家可以參考這兩篇文章12

總結

異步編程帶來的問題在客戶端Javascript中并不明顯,但隨著服務器端Javascript越來越廣的被使用,大量的異步IO操作使得該問題變得明顯。許多不同的方法都可以解決這個問題,本文討論了一些方法,但并不深入。大家需要根據自己的情況選擇一個適于自己的方法。
 

同時,隨著ES6的定義,Javascript的語法變得越來越豐富,更多的功能帶來了很多便利,然而原本簡潔,單一目的的Javascript變得復雜,也要承擔更多的任務。Javascript何去何從,讓我們拭目以待。

原文鏈接:http://my.oschina.net/taogang/blog/267707

責任編輯:林師授 來源: oschina博客
相關推薦

2015-04-22 10:50:18

JavascriptJavascript異

2020-10-15 13:29:57

javascript

2017-07-13 12:12:19

前端JavaScript異步編程

2016-09-07 20:43:36

Javascript異步編程

2021-06-02 09:01:19

JavaScript 前端異步編程

2011-11-11 15:47:22

JavaScript

2021-10-15 09:56:10

JavaScript異步編程

2021-12-10 07:47:30

Javascript異步編程

2023-12-04 13:22:00

JavaScript異步編程

2011-11-10 10:23:56

Jscex

2021-06-06 19:51:07

JavaScript異步編程

2011-07-27 14:10:43

javascript

2022-10-31 09:00:24

Promise數組參數

2013-04-01 15:38:54

異步編程異步編程模型

2016-10-21 11:04:07

JavaScript異步編程原理解析

2013-01-07 10:44:00

JavaScriptjQueryJS

2013-03-08 09:33:25

JavaScript同步異步

2021-11-01 22:36:04

JavaScript

2011-11-16 13:22:38

Jscex

2021-06-28 08:10:59

JavaScript異步編程
點贊
收藏

51CTO技術棧公眾號

主站蜘蛛池模板: 日韩成人精品一区 | 日韩精品在线视频 | 免费观看一级黄色录像 | 丁香久久 | 欧美日韩一区二区电影 | 一区二区三区国产 | 久久人人网 | 国产日韩免费观看 | 日本不卡高字幕在线2019 | 亚洲免费在线视频 | 夜夜夜夜草 | 久久久久久免费免费 | 精品国产一区二区三区成人影院 | 国产欧美精品一区二区 | 欧美激情在线一区二区三区 | 亚洲一区综合 | 国产精品久久久久久52avav | 久久久91精品国产一区二区三区 | 欧美一区二区三区的 | 国产精品入口麻豆www | 99re超碰 | 欧美free性 | 国产一区在线免费观看视频 | 国产午夜精品视频 | 久久久久久久久久久久一区二区 | 久久综合九色综合欧美狠狠 | 最新日韩欧美 | 日韩久久久久久久 | 日韩精品一区二区三区中文在线 | 欧美在线a| 亚洲一二三区在线观看 | 久久国产亚洲 | 欧美一区二区三区免费电影 | 91精品久久久久久久 | 免费观看一级特黄欧美大片 | 91精品国产欧美一区二区 | 夜夜精品浪潮av一区二区三区 | 97精品国产97久久久久久免费 | 一区 | 久草视频观看 | 青青草综合网 |