Promise は es6 に基づいていますか?

＃＃＃＃＃＃はい。 Promise は ECMAScript 6 の新しい参照タイプで、非同期操作の最終的な完了または失敗を表します。 Promise は、非同期プログラミングの呼び出しコードで複雑すぎるロジックを記述する問題を解決します。ネットワーク リクエストが非常に複雑な場合、コールバック地獄が発生します。このように、これらのコードを一緒に記述すると、非常に複雑に見えて読みにくくなります。 Promise を使用すると、コードがより美しくエレガントになります。

このチュートリアルの動作環境: Windows 7 システム、ECMAScript バージョン 6、Dell G3 コンピューター。

ECMAScript 6 では、Promises/A 仕様、つまり Promise タイプの完全なサポートが追加されています。 Promise は発売されると非常に人気があり、主要な非同期プログラミング メカニズムになりました。最新のブラウザはすべて ES6 の期待をサポートしており、他の多くのブラウザ API は期待に基づいています。

Promise は ECMAScript 6 の新しい参照タイプで、非同期操作の最終的な完了または失敗を表します。

1. Promise 関数は何をしますか?

Promise 関数は、コード ロジックを呼び出す非同期プログラミングの過度に複雑な記述の問題を解決します。複雑だとコールバック地獄が現れるので、これらのコードを一緒に書くと非常に複雑で読みにくくなりますが、promiseを使うとより美しくエレガントなコードになります。 2. Promise 3 状態

まず、開発中に非同期操作がある場合、非同期操作の Promise をラップできます

非同期操作の後に 3 つの状態が存在します

pending：等待状态，比如正在进行网络请求，或者定时器没有到时间。
fulfill：满足状态，当我们主动回调了resolve时，就处于该状态，并且会回调.then()
reject：拒绝状态，当我们主动回调了reject时，就处于该状态，并且会回调.catch()

3.

1 を実装し、

1 をキャッチします。保留状態の関数は同期です。そしてすぐに実行されます

2.thenとcatchは非同期です。promiseオブジェクトに非同期操作がなく、thenメソッドやcatchがすぐに実行される場合でも、ここで2つのメソッドを追加することができます。

##2. ステータスを確認する
#1. 保留ステータス処理関数で捕捉されないエラーが発生した場合、ステータスは保留中になり、直接拒否されたステータスになり、キャッチできるようになります。Capture

//参数 函数（resolve,reject）
    new Promise((resolve, reject) => {
        setTimeout(() => {
            //请求成功的时候调用resolve
            resolve('22222')
            //请求失败的时候调用reject
            reject('error message')
        }, 1000)
    }).then((data) => { //请求成功处理函数
        console.log(data)
    }).catch((err) => { //请求失败处理函数
        console.log(err)
    })

3.async と await

1.Use Promise:

var pro = new Promise((resolve, reject) => {
            throw new Error("123");

            // try{
            //     throw new Error("123"); 
            // } catch(e) {}

            resolve(12);
            reject(34);
        })

        // pro.then(data => {
        //     console.log(data);
        // }, err => {
        //     console.log(err);
        // })


        console.log(pro);
        

        pro.then(data => {
            console.log(data);
            
        })

        pro.catch(data => {
            console.log(data);
            
        })

2.非同期の使用 ：

async と await は ES7 によって提案されています

async の役割:

関数の戻り値での Promise オブジェクトの作成を簡略化する 一般的な状況 以下では、関数の先頭に async が記述されており、変更された関数の戻り値は Promise オブジェクトである必要があります。一部の特殊な場合にのみ、Promise オブジェクトが手動で返されます。

関数: Promise のような非同期の問題を解決します。ただし、その利点は、非同期コードを同期コードと同じにすることです!!
注: 同期メソッドでは、return を通じて結果を取得します。 value の場合、非同期メソッドはコールバック関数に依存して結果を取得します。
async と await で使用される基本構文

:

通常の関数の前に async を追加することであり、呼び出しは同じです通常の関数と同様

Async は通常、await と組み合わせて使用​​されます

• await の後には Promise オブジェクトが続きます await は非同期で使用する必要がありますfunction

• const makeRequest = () =>
          getJSON().then(data => {
              console.log(data)
              return "done"
          })
  
      makeRequest()

  3. 違い

• 1. 関数の前に追加の aync キーワードがあります。 await キーワードは、aync で定義された関数内でのみ使用できます。 async 関数は暗黙的に Promise を返し、Promise の解決値は関数の戻り値になります。 (例の reosolve 値は文字列「done」です)

  2. 最も外側のコードでは await を使用できません。これは async 関数内にないためです。

4.promise メソッド

const makeRequest = async () => {
 // await getJSON()表示console.log会等到getJSON的promise成功reosolve之后再执行。
        console.log(await getJSON)
        return "done"
    }

    makeRequest()

1.all メソッド

続行する前に、2 つ以上のリクエストが正常に返されるまで待機する必要がある場合があります。次のステップでは、約束のすべてのメソッドは、次のコールバックを行う前に、すべての非同期リクエストが完了するのを待つことです。

var r1 = new Promise((resolve,reject) => {
            setTimeout(function(){
                resolve("我是第一个请求");
            },1000)
        })
        var r2 = new Promise((resolve,reject) => {
            setTimeout(function(){
                resolve("我是第二个请求");
            },3000)
        })
        var r3 = new Promise((resolve,reject) => {
            setTimeout(function(){
                resolve("我是第三个请求");
            },4000)
        })
        var r4 = new Promise((resolve,reject) => {
            setTimeout(function(){
                resolve("我是第四个请求");
            },500)
        })

2.race メソッドリクエストは同時に送信されます。最初に戻ってくるのは誰のデータを使用するかです。

Promise.all([r1,r2,r3,r4]).then(data => {
            console.log(data);
            
        })

5. Promise カプセル化 Ajax のケース

Promise.race([r1,r2,r3,r4]).then(data => {
           console.log(data);
           
       })

[関連する推奨事項:

JavaScript ビデオ チュートリアル

、

Web フロントエンド

]

以上がPromise は es6 に基づいていますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。