Async/Awaitの原理と簡単な実現

Async/Awaitの原理と簡単な実現
解決関数コールバックはいくつかの段階を経て,Promiseオブジェクト,Generator関数からasync関数に移行した.async関数は現在、関数コールバックを解決する最良の方法である.Python、java spring、goなど、多くの言語でasyncが実現されています.
async awaitの使い方
async関数はPromiseオブジェクトを返し、関数が実行されるとawaitに遭遇すると先に戻り、トリガされた非同期操作が完了するまで待ってから、関数体内の後ろの文を実行します.

function getNum(num){
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(num+1)
        }, 1000)
    })
}
const func = async ()=>{
    const f1 = await getNum(1)
  const f2 = await getNum(f1)
  console.log(f2) 
  //   3 
}
func()

深く理解する
async関数を理解するには、async関数がGenerator関数の構文糖であるため、Generator関数を理解する必要があります.
Generatoジェネレータ
GeneratorはES 6規格で導入された新しいデータ型である.Generatorは、内部に多くの状態がカプセル化され、反復器Iteratorオブジェクトが返されるステートマシンとして理解できます.この反復器によって、関連する値と状態を巡回することができます.Generatorの顕著な特徴は,反復器の一部として毎回の戻り値が保存され,明示的に呼び出されることである.
OK、その基本的な実現を知ったら、私たちは自分で彼を実現することができます.

//      promise，        ，       ++
function getNum(num){
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(num+1)
        }, 1000)
    })
}

//     ，    Generator       ，     
function asyncFun(func){
  var gen = func();

  function next(data){
    var result = gen.next(data);
    if (result.done) return result.value;
    result.value.then(function(data){
      next(data);
    });
  }

  next();
}

//       Generator  ，             promise  ，      
var func = function* (){
  var f1 = yield getNum(1);
  var f2 = yield getNum(f1);
  console.log(f2) ;
};
asyncFun(func);