#21.非同期プログラミング(3)
1847 ワード
非同期プログラミング(3)
前回のレッスンでは、callbackを使用して非同期操作で順序を保証する方法について説明しました.
しかしながら、callbackを用いたコードは、callbackが重なるほど可読性が悪くなるという問題がある.
そこで今日はcallback hellを解決する新しい方法Promiseをご紹介します
Promiseを使用してcallbackで前回作成したコードに従って作成します.
2つのコードを比較します.
1.Calbackバージョン
const moveLeft = (cb) => {
setTimeout(() => {
console.log('left')
if(cb){
cb()
}
}, 10)
}
const moveRight = (cb) => {
setTimeout(() => {
console.log('right')
if(cb){
cb()
}
}, 30)
}
moveRight(function() {
moveLeft(function() {
moveRight(function() {
moveLeft()
})
})
})
2.Promiseバージョンconst moveLeftPromise = new Promise((resolve, reject) => {
resolve(() => console.log('left'))
})
const moveRightPromise = new Promise((resolve, reject) => {
resolve(() => console.log('right'))
})
moveRightPromise
.then(res => {
res()
return moveLeftPromise
})
.then(res => {
res()
return moveRightPromise
})
.then(res => {
res()
return moveLeftPromise
})
.then(res => res())
// 실행 결과 : right left right left
3.比較コールバックが重なり続けると、>形状のコールバックhellが現れ、毒性が低下する.
この問題を解決するためにES 6はPromiseを導入した.
Promiseはオーバーラップしてもcallbackのように>形状のコードにはならないのでcallbackよりも読みやすさが良い.逆に、Promiseはthenを日付とするthenチェーンを生成します.
4.結論
コールバックとpromiseの役割は非同期操作の順序を保証することである.
しかし、コードの可読性はもっと良いので、できるだけpromiseを使います.
これまでpromiseを使用してcallback hellを削除する方法について理解してきました.
callback hellはキャンセルされましたが、代わりにチェーンがありました.
では,chainはクリーンなコードと考えられるが,JavaScriptではthechainを取り除く方法がある.
今日はこれで終わります.次の授業ではthen chainを削除する方法を紹介します.
Reference
この問題について(#21.非同期プログラミング(3)), 我々は、より多くの情報をここで見つけました https://velog.io/@2lang/21.-비동기-프로그래밍3テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol