快捷導(dǎo)航

JavaScript 異步調(diào)用框架 (Part 2 - 用例設(shè)計)

更新時間：2009年08月03日 23:53:28 作者：

在上一篇文章里說到，我們要設(shè)計一個異步調(diào)用框架，最好能夠統(tǒng)一同步異步調(diào)用的接口，同時具體調(diào)用順序與實現(xiàn)方式無關(guān)。那么我們現(xiàn)在就來設(shè)計這樣一個框架的用例。

傳遞回調(diào)
我們首先要考慮的一個問題是，如何傳遞回調(diào)入口。在最傳統(tǒng)的XHR調(diào)用當(dāng)中，回調(diào)函數(shù)會被作為最后一個參數(shù)傳遞給異步函數(shù)：

復(fù)制代碼代碼如下:

function asyncOperation(argument, callback)

在參數(shù)相當(dāng)多的時候，我們可以把參數(shù)放到一個JSON里面，這樣參數(shù)就如同具名參數(shù)一樣，可以通過參數(shù)名選擇性的傳遞參數(shù)，不傳遞的參數(shù)相當(dāng)于使用默認(rèn)值。這是從Prototype開始就流行起來的做法：

復(fù)制代碼代碼如下:

function asyncOperation(argument, options)

然而這兩種做法都有一個壞處，就是把同步函數(shù)改為異步函數(shù)（或同步異步混合函數(shù)）時，必須顯式地修改函數(shù)簽名，在最后增加一個（或多個）參數(shù)。

由于在調(diào)用棧的底層引入異步函數(shù)對我們來說太常見了，為此可能要更改一大堆上層調(diào)用函數(shù)簽名的成本實在是太高了，所以我們還是想一個不用修改函數(shù)簽名的做法吧。

在這里我參考了.NET Framework的IAsyncResult設(shè)計，把異步操作有關(guān)的一切信息集中到一個對象上來，從而避免了對函數(shù)簽名的修改。在此，我們假設(shè)一個異步函數(shù)的調(diào)用原型是這樣子的：

復(fù)制代碼代碼如下:

function asyncOperation(argument) { 
operation = new Async.Operation(); 
setTimeout(function() { operation.yield("hello world"); }, 1000); 
return operation; 
} 

在這段代碼里，我們返回了一個Operation對象，用于將來傳遞回調(diào)函數(shù)。同時，我們通過setTimeout模擬了異步返回結(jié)果，而具體的返回方式就是yield方法。

接著，我們還要設(shè)計傳遞回調(diào)函數(shù)的方法。由于我們不能好像C#那樣重載+=運(yùn)算符，所以只能用函數(shù)傳遞回調(diào)函數(shù)：

復(fù)制代碼代碼如下:

var operation = asyncOperation(argument); 
operation.addCallback(function(result) { alert(result); }); 

在C#里面做這樣的設(shè)計是不安全的，因為在異步操作可能在添加回調(diào)之前就完成了。但在JavaScript里面這樣寫是安全的，因為JavaScript是單線程的，緊接著asyncOperation的同步addCallback必然先執(zhí)行，asyncOperation中的異步y(tǒng)ield必然后執(zhí)行。

調(diào)用順序
可能有人要問，如果用戶使用同步的方式來調(diào)用yield，這時候執(zhí)行順序不一樣依賴于yield的實現(xiàn)嗎？沒錯，不過yeild是在框架中一次性實現(xiàn)的，我們只要把它做成異步的就可以了，這樣即使對它進(jìn)行同步調(diào)用，也不影響執(zhí)行順序：

復(fù)制代碼代碼如下:

function psudoAsyncOperation(argument) { 
operation = new Async.Operation(); 
operation.yield("hello world"); 
return operation; 
} 
var operation = asyncOperation(argument); 
operation.addCallback(function(result) { alert(result); }); 

就算把代碼寫成這個樣子，我們也能確保addCallback先于yield的實際邏輯執(zhí)行。

事后回調(diào)
有時候，框架的使用者可能真的寫出了先yield后addCallback的代碼。這時候，我認(rèn)為必須保證addCallback中添加的回調(diào)函數(shù)會被立即觸發(fā)。因為用戶添加這個回調(diào)函數(shù)，意味著他期望當(dāng)異步操作有結(jié)果時通知這個回調(diào)函數(shù)，而這與添加回調(diào)函數(shù)時異步操作是否完成無關(guān)。為此，我們再添加一個用例：

復(fù)制代碼代碼如下:

function psudoAsyncOperation(argument) { 
operation = new Async.Operation(); 
operation.yield("hello world"); 
return operation; 
} 
var operation = asyncOperation(argument); 
setTimeout(function() { 
operation.addCallback(function(result) { alert(result); }); 
}, 1000); 

小結(jié)
到這里，我們就設(shè)計好了一個名為Async.Operation的異步操作對象，具體如何實現(xiàn)關(guān)鍵的yield方法和addCallback方法將在下一篇文章講述如果。

您可能感興趣的文章:

相關(guān)文章

解決layui表格內(nèi)文本超出隱藏的問題
今天小編就為大家分享一篇解決layui表格內(nèi)文本超出隱藏的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2019-09-09
Webwork 實現(xiàn)文件上傳下載代碼詳解
WebWork 當(dāng)然也提供了很友好的攔截器來實現(xiàn)對文件的上傳，讓我們可以專注與業(yè)務(wù)邏輯的設(shè)計和實現(xiàn)，在實現(xiàn)上傳和下載時順便關(guān)注了下框架上傳下載的實現(xiàn)
2016-02-02
bootstrapValidator表單驗證插件學(xué)習(xí)
這篇文章主要為大家詳細(xì)介紹了表單驗證插件bootstrapValidator的使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2016-12-12
JavaScript實現(xiàn)各種排序的代碼詳解
這篇文章給大家介紹了js實現(xiàn)各種排序功能，包括冒泡排序，選擇排序和插入排序，代碼簡單易懂，非常不錯，具有參考借鑒價值，需要的的朋友參考下吧
2017-08-08
提高Web性能的前端優(yōu)化技巧總結(jié)
這篇文章講述可以幫助改善優(yōu)化前端的技術(shù)，非常有用。主要內(nèi)容有清理代碼、壓縮圖片、壓縮外部資源、使用CDN，以及一些其它方法。這些方法會為你的網(wǎng)站帶顯著的速度提升和整體性能提升。下面跟著小編一起來看下吧
2017-02-02
探索JavaScript函數(shù)的無限可能(函數(shù)基本概念)
JavaScript中的函數(shù)是一種重要的編程概念，它允許我們封裝可重用的代碼塊，并在需要時進(jìn)行調(diào)用，本文將深入介紹JavaScript函數(shù)的各個方面，包括函數(shù)定義和調(diào)用、參數(shù)和返回值、作用域和閉包、高階函數(shù)以及常見的函數(shù)應(yīng)用場景，感興趣的朋友一起看看吧
2023-08-08
js實現(xiàn)GIF圖片的分解和合成
這篇文章主要為大家詳細(xì)介紹了js實現(xiàn)GIF圖片的分解和合成，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2019-10-10
這篇文章主要為大家詳細(xì)介紹了JavaScript面向?qū)ο缶帉戀徫镘嚬δ艿南嚓P(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2016-08-08