小試JavaScript多線程
當前位置:點晴教程→知識管理交流
→『 技術文檔交流 』
法寶就是Concurrent.Thread這個家伙,其實是一個js庫,你可以從網站下載源代碼.如何使用呢? 很簡單 Concurrent.Thread.create(f, a1, a2, ...) f為你要調用的函數,a1,a2為該函數的參數,這樣創建了一個線程,你可以同時創建多個,他們會同時去執行,這個庫同時提供 了很多的方法,類似其它語言里的Thread使用方法,如Concurrent.Thread.stop();等。具體去網站去了解。 復制代碼 代碼如下: <html> <body> <script type="text/javascript" src="Concurrent.Thread.Compiler.js"></script> <script type="text/javascript"> function hello ( ) { document.body.innerHTML += "H"; document.body.innerHTML += "e"; document.body.innerHTML += "l"; document.body.innerHTML += "l"; document.body.innerHTML += "o"; document.body.innerHTML += ","; document.body.innerHTML += " "; document.body.innerHTML += "w"; document.body.innerHTML += "o"; document.body.innerHTML += "r"; document.body.innerHTML += "l"; document.body.innerHTML += "d"; document.body.innerHTML += "!"; } Concurrent.Thread.create(hello); </script> </body> </html> 作者 Daisuke Maki譯者 張凱峰
雖然有越來越多的網站在應用AJAX技術進行開發,但是構建一個復雜的AJAX應用仍然是一個難題。造成這些困難的主要原因是什么呢?是與服務器的異步通信問題?還是GUI程序設計問題呢?通常這兩項工作都是由桌面程序來完成的,那究竟為何開發一個可以實現同樣功能的AJAX應用就這么困難呢? AJAX 開發中的難題 讓我們通過一個簡單的例子來認識這個問題。假設你要建立一個樹形結構的公告欄系統(BBS),它可以根據用戶請求與服務器進行交互,動態加載每篇文章的信息,而不是一次性從服務器載入所有文章信息。每篇文章有四個相關屬性:系統中可以作為唯一標識的ID、發貼人姓名、文章內容以及包含其所有子文章 ID的數組信息。首先假定有一個名為getArticle()的函數可以加載一篇文章信息。該函數接收的參數是要加載文章的ID,通過它可從服務器獲取文章信息。它返回的對象包含與文章相關的四條屬性:id,name,content和children。例程如下: function ( id ) { var a = getArticle(id); document.writeln(a.name + " " + a.content); } 然而你也許會注意到,重復用同一個文章ID調用此函數,需要與服務器之間進行反復且無益的通信。想要解決這個問題,可以考慮使用函數 getArticleWithCache(),它相當于一個帶有緩存能力的getArticle()。在這個例子中,getArticle()返回的數據只是作為一個全局變量被保存下來: var cache = {}; function getArticleWithCache ( id ) { if ( !cache[id] ) { cache[id] = getArticle(id); } return cache[id]; } 現在已將讀入的文章緩存起來,讓我們再來考慮一下函數backgroundLoad(),它應用我們上面提到的緩存機制加載所有文章信息。其用途是,當讀者在閱讀某篇文章時,從后臺預加載它所有子文章。因為文章數據是樹狀結構的,所以很容易寫一個遞歸的算法來遍歷樹并且加載所有的文章: function backgroundLoad ( ids ) { for ( var i=0; i < ids.length; i++ ) { var a = getArticleWithCache(ids[i]); backgroundLoad(a.children); } } backgroundLoad ()函數接收一個ID數組作為參數,然后通過每個ID調用前面定義過的getArticldWithCache()方法,這樣就把每個ID對應的文章緩存起來。之后再通過已加載文章的子文章ID數組遞歸調用backgroundLoad()方法,如此整個文章樹就被緩存起來。 到目前為止,一切似乎看起來都很完美。然而,只要你有過開發AJAX應用的經驗,你就應該知曉這種幼稚的實現方法根本不會成功,這個例子成立的基礎是默認 getArticle()用的是同步通信。可是,作為一條基本原則,JavaScript要求在與服務器進行交互時要用異步通信,因為它是單線程的。就簡單性而言,把每一件事情(包括GUI事件和渲染)都放在一個線程里來處理是一個很好的程序模型,因為這樣就無需再考慮線程同步這些復雜問題。另一方面,他也暴露了應用開發中的一個嚴重問題,單線程環境看起來對用戶請求響應迅速,但是當線程忙于處理其它事情時(比如說調用getArticle()),就不能對用戶的鼠標點擊和鍵盤操作做出響應。 如果在這個單線程環境里進行同步通信會發生什么事情呢?同步通信會中斷瀏覽器的執行直至獲得通信結果。在等待通信結果的過程中,由于服務器的調用還沒有完成,線程會停止響應用戶并保持鎖定狀態直到調用返回。因為這個原因,當瀏覽器在等待服務器響應時它不能對用戶行為作出響應,所以看起來像是凍結了。當執行 getArticleWithCache()和backgroundLoad()會有同樣的問題,因為它們都是基于getArticle()函數的。由于下載所有的文章可能會耗費很可觀的一段時間,因此對于backgroundLoad()函數來說,瀏覽器在此段時間內的凍結就是一個很嚴重的問題——既然瀏覽器都已經凍結,當用戶正在閱讀文章時就不可能首先去執行后臺預加載數據,如果這樣做連當前的文章都沒辦法讀。 如上所述,既然同步通信在使用中會造成如此嚴重的問題,JavaScript就把異步通信作為一條基本原則。因此,我們可以基于異步通信改寫上面的程序。 JavaScript要求以一種事件驅動的程序設計方式來寫異步通信程序。在很多場合中,你都必須指定一個回調程序,一旦收到通信響應,這個函數就會被調用。例如,上面定義的getArticleWithCache()可以寫成這樣: var cache = {}; function getArticleWithCache ( id, callback ) { if ( !cache[id] ) { callback(cache[id]); } else { getArticle(id, function( a ){ cache[id] = a; callback(a); }); } } 該文章在 2010/11/25 22:11:57 編輯過 |
關鍵字查詢
相關文章
正在查詢... |