JavaScript中使用Callback控制流程介紹_javascript技巧

1.沒有顯式的return，容易產(chǎn)生多余流程，以及由此引發(fā)的bug。
2.造成代碼無限嵌套，難以閱讀。

下面就來說說怎么解決避免上述的問題。

第一個問題是一個習慣問題，在使用callback的時候往往會讓人忘了使用return，這種情況在使用coffee-script的時候尤甚（雖然它在編譯成javascript時會自行收集最后的數(shù)據(jù)作為返回值，但是這個返回值并不一定代表你的初衷）。看看下面的例子。

代碼如下:
a = (err, callback)->
callback() if err?
console.log 'you will see me'

b = ->
console.log 'I am a callback'

a('error', b)

在這種所謂”error first”的代碼風格中，顯然我們不希望出錯時方法a中的后續(xù)代碼仍然被執(zhí)行，但是又不希望用throw來讓整個進程掛掉（要死也得優(yōu)雅的死嘛~），那么上面的代碼就會產(chǎn)生bug。

一種解決方案就是老老實實的寫if...else...，但是我更傾向于下面的做法：
代碼如下:
a = (err, callback)->
return callback() if err?
console.log 'you will not see me'

b = ->
console.log 'I am a callback'

a('error', b)

javascript異步方法中的返回值大多沒什么用處，所以這里用return充當一個流程控制的角色，比if...else...更少的代碼，但是更加清晰。

第二個問題是娘胎里帶來的，很難根除。

一種不錯的方法是使用一些流程控制模塊來將代碼顯得更加有條理，比如async就是一個不錯的模塊，提供了一系列的接口，包括迭代，循環(huán)，和一些條件語句，甚至還包含了一個隊列系統(tǒng)。下面的例子可以表名兩種寫法的優(yōu)劣
代碼如下:
#normal

first = (callback)->
console.log 'I am the first function'
callback()

second = (callback)->
console.log 'I am the second function'
callback()

third = ()->
console.log 'I am the third function'

first ->
second ->
third()

# use async

async = require('async')

async.waterfall [
first,
second,
third
], (err)->

作為睿智的你，會選擇哪一種呢。

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com