ホームページ > 記事 > ウェブフロントエンド > jsでのPromiseインスタンス解析

jsでのPromiseインスタンス解析

小云云オリジナル: 2018-02-05 10:00:452171ブラウズ

nodejs が非常に速いことは誰もが知っていますが、なぜそんなに速いのでしょうか?その理由は、node が待機する必要があるイベントを処理するために非同期コールバックを使用するため、コードはどこかで待機することなく実行され続けるからです。ただし、欠点もあります。たとえば、このコールバックを実行した後、次のコールバックを実行する必要があるため、階層がネストされてわかりにくくなります。 . 「コールバック刑務所」に入るのは簡単で、次のような例に簡単につながる可能性があります:

async(1, function(value){
 async(value, function(value){
 async(value, function(value){
  async(value, function(value){
  async(value, function(value){
   async(value, final);
  });
  });
 });
 });
});

この書き方は人を崩壊させるでしょう、この問題を解決する方法はありますか、それとも他の方法はありますか?書くことの？答えは「はい」です。es6 の新しい Promise オブジェクトと es7 の async await でこの問題を解決できます。もちろん、Promise オブジェクトについては最初に紹介し、es7 の async await については次の記事で説明します。 Promise オブジェクトについては以下で紹介します。

2. はじめに

Promise は、非同期操作をよりエレガントに、より美しく、読みやすく記述するために使用されるオブジェクトです。名前の通り約束という意味で、Promiseを使用した後は必ず返事をくれる、成功しても失敗しても返事をくれるので逃げ出す心配がない。離れて、ははは。したがって、Promise には保留中 (進行中)、解決済み (完了)、および拒否 (失敗) の 3 つの状態があります。非同期的に返された構造のみがその状態を変更できます。したがって、通常、Promise プロセスは保留中→解決、または保留中→拒否の 2 つだけです。

Promise オブジェクトには、コールバック関数を実行するために使用される、より一般的に使用される then メソッドもあります。1 つは成功した解決されたコールバック、もう 1 つは失敗した拒否されたコールバックです。コールバックパラメータはオプションです。また、then メソッドは、Promise オブジェクトを返すこともできるため、チェーン内で呼び出すことができます。次に、コード:

var Pro = function (time) {
   //返回一个Promise对象
   return new Promise(function (resolve, reject) {
    console.log('123');
    //模拟接口调用
    setTimeout(function () {
     //这里告诉Promise 成功了，然后去执行then方法的第一个函数
     resolve('成功返回');
    }, time);
   })
  };
  (function(){
   console.log('start');
   Pro(3000)
   .then(function(data){
    console.log(data);
    return Pro(5000);})
   .then(function(data){
    console.log(data);
    console.log('end');
   })
  })();

上記のコードでは、Pro 変数が定義され、それに匿名関数が割り当てられ、関数は Promise オブジェクトを返し、オブジェクト内の関数を受け取り、resolve とを渡します。メソッドをそれぞれパラメータとして拒否し、setTimeOut を使用して非同期リクエストをシミュレートすると、resolve メソッドの関数が呼び出されます。結果は以下の通りです:

3. Promise api

1、Promise.resolve()
2、Promise.reject()
3、Promise.prototype.then()
4、Promise.prototype.catch ()
5. Promise.all() // すべて完了、
6. Promise.race() // 1 つだけ完了、これは

1 の関数。 () は、オブジェクトが Promise オブジェクトに変換されるようになります。resolvel; Promise.resolve('test')==new Promise(resolve=>resolve('test'))

2。ステータスが拒否された Promise オブジェクト ;

3. then メソッドは上で紹介されているため、ここでは紹介しません。

4. catch(): エラー発生時のコールバック関数。

5. Promise.all() は、すべての結果が完了した後にのみ then() の操作が成功する場合に適しています。例:

let p1 =new Promise(function(resolve,reject){
   resolve(1);
  });
  let p2 = new Promise(function(resolve,reject){
   resolve(2);
  });
  let p3 = new Promise(function(resolve,reject){
   resolve(3);
  });
  Promise.all([p1, p2, p3]).then(function (results) {
   console.log('success:'+results);
  }).catch(function(r){
   console.log("error");
   console.log(r);
  });

最終出力:

6. Promise.race() の機能は、1 つのインスタンスが状態を変更する限り、Promise はに変更されます。

4. 例

var Pro = function () {
   //返回一个Promise对象
   return new Promise(function (resolve, reject) {
    //模拟接口调用
    setTimeout(function () {
     resolve(true);
    }, 1000);
   })
  };
  var Pro2 = function () {
   //返回一个Promise对象
   return new Promise(function (resolve, reject) {
    //模拟接口调用
    setTimeout(function () {
     resolve('Pro2成功执行');
    }, 1000);
   })
  };
  
  Pro().then(function(data){
   var val = data;
   console.log(val)
   if (val) {
    console.log(1111)
    return Pro2()
   }
   
  }).then(function(data1){
   console.log(data1)
  })

出力:

このように、then メソッドを使用してチェーン呼び出しを実装できます。

jsでのPromiseインスタンス解析

関連記事