先端非同期ソリューション-3(Promise)

4905 ワード

非同期 javascript プロミス es 6

また何日間も書きませんでした.この数日間ずっと断続的にPromiseとgeneratorを勉強しています.今日やっと二つの遊びを結び付けて、異歩問題を解決できました.今日はまずプロモーション関連の使い方と非同期の処理を皆さんに分かち合います.いつものように、まずPromiseをシミュレートします.

//         
let MyPromise = Promise;

冗談です.実はこの二日間ずっとPromiseの実現を見ていますが、まだよく分かりません.ですから、Promiseのコードが実現しましたので、とりあえず置いておきます.完全に理解してから、また新しく分けます.ここでまず、いくつか紹介します.私が比較的いいと思うPromiseが実現したブログです.勉強したい仲間は先にそちらに行って見てもいいです.もちろん更新したら、皆さんからいい文章を書いてください.Promiseの対象を徹底的に理解します.――es 5の文法で自分のPromise(上編)という文章用のes 5の文法を実現します.この文章を使ってPromiseの原理を実現することができます.classを使っています.だから、皆さんがS 6に対してよく知っている必要があります.いい文章です.
次に、Promiseの最も一般的な部分を紹介します.

まず、最も簡単なのは一つのPromiseオブジェクトの使い方

//Promise()      ，       Promise     ，              
var promise = new Promise(function (resolve, reject) {
  //resolve         ,reject         
  setTimeout(function () {
    //           ，                          
    let num = Math.random();
    if (num  > 0.8) {
      //       
      console.log("reject")
      reject(num + "  0.8，         ")
    } else {
      //       
      console.log("resolve")
      resolve(num + "  0.8，         ")
    }
  }, 100)
});
console.log("  Promise     ");
//Promise   .then()        ，        ，        
//          resolve  reject        
promise.then(function (data) {
  //         resolve        ,   data    resolve()     
  console.log(data)
}, function (err) {
  ///         reject        ,   err    reject()     
  console.error(err)
});
console.log("promise .then      ")

だけです.F 12でコンソールを喚起して、このコードを何回か実行してもいいです.どんな結果があるかを見てください.何回か実行してから、この二つの結果が見られます.その中のundefindはconsole.log("promise .then ")行のコードの戻りです.皆さんは気にしなくてもいいです.ここでは成功の結果も失敗の結果もタイマーが実行してからプリントアウトしたものと見られます.このような書き方は簡単な非同期プログラミングを実現するのに役立ちます.

次に、複数のPromiseオブジェクトが同時に使用する使い方を紹介します.まず、最も一般的なのは、then()チェーンコールの方法

 //        Promise  ，        ，                      
 function promise(log) {
   return new Promise(function (resolve, reject) {
     setTimeout(function () {
       log = log || [];
       //        ，             
       let num = Math.random();
       if (num > 0.5) {
         log.push(num + "  0.5，         ");
         reject(log)
       } else {
         log.push(num + "  0.5，         ");
         resolve(log)
       }
     }, 100)
   })
 }

.then()でPromiseオブジェクトに戻った場合

var promise1 = promise();
//promise1.then()       Promise  
//     .then()      !!!    !!!       Promise    ，       !!!.then()  !!!    

//     Promise     
promise1.then(function (data) {
  console.log(data);
  return promise(data)
}, function (err) {
  console.error(err);
  return promise(err)
}).then(function (data) {
  console.log(data)
}, function (err) {
  console.error(err)
});

というコードが実行された後、4つの結果があります.2回とも成功しました.2回とも失敗しました.2回目の成功は初めてです.第二の失敗はこの方法によって、私達は比較的明瞭な方法で私達の非同期コードを書くことができます.特に複数の非同期操作が入れ子になったときは、チェーン呼び出しが可能です.先ほどPromiseの対象に戻ったシーンを見ました.またPromiseに戻らなかったシーンを見てみます.

//        Promise  ，.then()               Promise  （           undefined）
//          return new Promise((resolve,reject)=>{resolve(/*      */)})
promise1.then(function (data) {
  console.log(data);
  return data;
}, function (err) {
  console.error(err);
  return err;
}).then(function (data) {
  console.log(data)
}, function (err) {
  //           ，      .then()     new Promise((resolve,reject)=>{resolve(/*      */)})
  //   Promise   reject          ，               
  console.error(err)
});

の説明は全部コメントに書いてあります.次に運行図を貼ります.このコードは次の二つの結果を実行します.

は、すべての要求が戻ってから、ある動作

//  promise,                 
function promise(log, time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      log = log || [];
      //        ，             
      let num = Math.random();
      if (num > 0.5) {
        log.push("    " + time + "," + num + "  0.5，         ");
        console.error(log);
        reject(log)
      } else {
        log.push("    " + time + "," + num + "  0.5，         ");
        console.log(log);
        resolve(log)
      }
    }, time)
  })
}
//Promise.all()      Promise     ，    Promise  
// Promise         Promise           ，     Promise           
var promise1 = promise(null, 10), promise2 = promise(null, 100),
  promise3 = Promise.all([promise1, promise2]);
promise3.then((data) => {
  //   data promise1, promise2       
  console.log("promise3", data)
}, (err, err2) => {
  //    
  console.error("promise3", err)
});

を実行することができます.このコードは全部で4つの可能な結果があります.もし2回が成功すれば、プロミゼ3は成功したコールを実行します.そして、フィードバック中のdataはプロミゼ1とプロミゼ2のリターン値の配列(配列順と.all()の順序が一致します.いずれかのプロミセが失敗すると、プロミゼ3はすぐに失敗のリピーターを実行します.また、リピート中のerrは失敗したプロミセがリジェクトに戻った値です.
記事はここまで書いています.Promiseでよく使われている使い方は全部話し終わったと思います.もっと詳しいPromiseの教程はMDNでプロミセについて説明してください.

OpenCVの設置及びvsプロジェクトの配置