JavaScriptの約束は何ですか?

あなたがJavaScriptの約束を聞いたことがないならば、チャンスはあなたがしばしばASと呼ばれるものを経験したということですcallback hell . コールバックの地獄は、あなたのコードの読みやすさが厳しく妨げられる程度に入れ子にされたコールバックを持つことになる状況に言及しています.
あなたがコールバック地獄を経験したことがないならば、私はあなたにそれがどのように見えるかを垣間見ることができます.ブレース自分自身を理解しようとすると、次のコードを達成しようとしている!

オーケー、公平であるために、これは少し誇張された例であったかもしれません.しかし、コールバックをネストしようとすると、コードの読みやすさを大幅に減らすことができます.
あなたがなぜあなたが書くコードの読みやすさについて気をつけなければならないかについて疑問に思っているならば、質問に深い答えを提供する次の記事を見てください.

コード可読性の心理学決して、これはegonエルブレ媒体で

エゴンエルブレ・ 2018年7月21日・ 14分読む 中

コールバック地獄が悪名高いと理解したので、開発者が最初にこの罠に陥る原因を簡単に見てみましょう.
コールバックを使用する主な理由は、非同期タスクを処理することです.多くの場合、これはAPIコールを作成し、レスポンスを受け取り、JSONに変換し、別のAPI呼び出しを行うためにこのデータを使用する必要があるためです.これはJavaScriptに固有の問題のように思えるかもしれません.これらのAPIの性質はデフォルトで非同期に呼び出され、回避策がないようです.
これはJavaScriptが画像に入ってくるということです.なぜなら、それはES 6の一部としてリリースされたネイティブのJavaScript機能で、コールバックの地獄を避けるために使用されることになっています.
約束は、非同期タスクのチェーンの完了後、同期的に返されるオブジェクトです.このオブジェクトは次の3つの状態のいずれかです.

これは、非同期タスクがエラーをスローしなかったことを意味します.

拒否:これは1つ以上のタスクが予想通りに実行できなかったことを意味し、エラーがスローされました.

未定:これは中間の状態のようです.そして、約束は満たされなかったか、拒絶されませんでした.

我々は、それが保留状態でないならば、約束が解決されると言います.これは拒絶状態にあっても約束をまとめることだ.
私たちはコールバック地獄を避けるために約束することができます.任意の回数.
. th ()は非ブロッキングコードです.これは、コールバック関数のシーケンスが同期して実行できることを意味します.
このように、どんなに多くの非同期タスクが存在する必要があるとしても、我々が必要とするすべては、彼らに対処する約束ベースのアプローチです!
これはすぐに最終的な値を返す代わりに、非同期タスクが将来のいくつかの時点で値を供給するという約束を返します.この操作をブロックするコードがないため、すべての非同期タスクが必要に応じて行われ、返されるプロミスが失敗したかどうかを反映します.
今、あなたは約束を理解しています.でもどうやって使うの?このセクションでそれに対処しましょう.
普通の古いコールバックを使用する例を考えてください.

ご覧のように、これは工夫された例ですが、コールバックの数が増えるにつれて関数コールのチェーンに従うのはかなり難しいです.さて、返された約束そのものにすべてのコールバックを連鎖させると、次の約束連鎖で終わることができます.

ここでは、我々はdemoFunction 起動後の約束を返します.この約束は最終的に有効な結果かエラーに評価されます.約束が満たされるならば、...next ()文が実行されます.
それはすべてに注意することが重要です.then ()は新しいプロシージャを返します.だから、demoFunction 約束を返し、解決された値はresult1 を使用して、次の関数を呼び出しますfirstCallback() . これは最後のコールバックが起動されるまで続けます.
約束のいずれかが拒否された場合、エラーがコールバックのいずれかでスローされたことを意味します.その場合、残り.thn ()文はショートされ、catch ()文が実行されます.
あなたは1つのことがわかります.catch ()はエラーフォールバックとして動作する必要がありますが、コードの前のバージョンでは、failureCallback 関数はコールバック関数コールに対してフォールバックエラーハンドラとして機能する.
この方法では、簡単に一連の入れ子になったコールバックを約束チェーンに変換することができます.
今まで我々は約束を使用してコールバックに対処するための新しい方法を学んだ.しかし、我々はどこから我々がこれらの約束を得るかについて議論しませんでした.この節では、任意の関数を変換する方法を学びます.パラメータ()
次の例では、約束を返さない機能を持っているので、まだPromiseチェインに含めることはできません.setTimeout(() => callbackFunc("5 seconds passed"), 5\*1000);ここではcallbackFunc エラーが発生する可能性は非常に低いので、エラーが発生した場合、エラーをキャッチする方法はありません.
この関数を約束を返すものに変換するには、次のように新しいキーワードを使用できます.

const wait = ms => new Promise((resolve, reject) => {
        setTimeout(resolve, ms);
    };

    wait(5*1000)
        .then(() => callbackFunc("5 seconds"))
        .catch(failureCallback);

こちらです.wait 呼び出されるたびに新しい約束を返す関数を表します.私たちは約束コンストラクタを使ってそうすることができます.したがって、wait は、setTimeout , それは約束を返します.
一旦約束が満たされた状態に達するならば、解決I . Eに関連した機能.callbackFunc が呼び出される.約束が拒絶されるならばfailCallback が実行される.
さらに自分の約束を作成する方法を理解するにはthis article , これには、より複雑な例があります.
Promiseコンストラクターのさまざまなインスタンスメソッドに深く飛び込む最善のリソースはMDN Docs .
この記事で準備されたアプローチはネストされたコールバックの単純な代替手段ですが、JavaScript(ECMAScript 2017またはES 8)の新しいバージョンもコールバック地獄に対処する機能を持っています!
async & waitというこの機能を見たい場合は、次の記事をご覧ください.それはブランドの新機能として記載されてsyntactic sugar この記事で議論された約束の概念の上に!したがって、あなたが約束の概念を理解している場合には、asyncと待つのES 8機能は理解するのはかなり簡単です.

ベン・ガリソンのメディアによって` async / wait '関数を導入する

ベン・ギャリソン・ 2018年3月22日・ 3分読む 中

うまくいけば、今、あなたは約束で武装している場合は、正常にコールバックの地獄には、次の時間は、コールバック機能の束を処理して求められている餌食を避けることができます!