JavaScript中使用Callback控制流程介紹
javascript中隨處可見的callback對于流程控制來說是一場災(zāi)難,缺點顯而易見:
1.沒有顯式的return,容易產(chǎn)生多余流程,以及由此引發(fā)的bug。
2.造成代碼無限嵌套,難以閱讀。
下面就來說說怎么解決避免上述的問題。
第一個問題是一個習(xí)慣問題,在使用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”的代碼風(fēng)格中,顯然我們不希望出錯時方法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)->
作為睿智的你,會選擇哪一種呢。
相關(guān)文章
ES6 proxy和reflect的使用方法與應(yīng)用實例分析
這篇文章主要介紹了ES6 proxy和reflect的使用方法,結(jié)合具體實例形式分析了ES6 proxy和reflect基本功能、原理、使用方法與操作注意事項,需要的朋友可以參考下2020-02-02
淺談JavaScript中Date(日期對象),Math對象
這篇文章主要簡單介紹了JavaScript中Date(日期對象),Math對象的相關(guān)資料,需要的朋友可以參考下2015-02-02
JS/jQuery實現(xiàn)默認顯示部分文字點擊按鈕顯示全部內(nèi)容
默認顯示部分文字,點擊按鈕顯示全部,類似這樣的功能在一些特殊的地方會見到吧,下面與大家分享下JS、jQuery如何實現(xiàn),感興趣的朋友可以參考下哈,希望對你有所幫助2013-05-05
詳解js如何優(yōu)雅處理后端返回的單元格數(shù)據(jù)
這篇文章主要為大家詳細介紹了JavaScript如何優(yōu)雅處理后端返回的單元格數(shù)據(jù),文中的示例代碼講解詳細,有需要的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-10-10

