JavaScriptジェネレータ関数をループする

Question

JavaScriptジェネレータ関数を使用してデータベースからデータを取得しようとしています。しかし、各ステップは、その前に来るデータに依存します。私は、ウェス・ボスのES6.ioコースから例を使用し、その中で、それは似た何かを行い、これは完璧に動作

function ajax(url) { 
    fetch(url).then(data => data.json()).then(data => dataGen.next(data)) 
} 

function* steps() { 
    console.log('fetching beers'); 
    const beers = yield ajax('http://api.react.beer/v2/search?q=hops&type=beer'); 
    console.log(beers); 

    console.log('fetching user'); 
    const user = yield ajax('https://api.github.com/users/[user]'); 
    console.log(user); 

    console.log('fetching fat joe'); 
    const fatJoe = yield ajax('https://api.discogs.com/artists/51988'); 
    console.log(fatJoe); 
} 

const dataGen = steps(); 
dataGen.next(); // kick it off 

のように見えます。問題は、これがグローバルに利用可能なdataGenに依存していることです。私は関数内でこれをすべて行う必要があります。どのように私はループの中でdataGenを呼び出すことができますが、別の関数からですか？ getInfo()コールは、理想的には、発電機をキックオフすることができ、データが満たされますように、次のいずれかに上の各ステップからのデータを受け渡すことができるだろう

function ajax(url) { 
    fetch(url).then(data => data.json()).then(data => dataGen.next(data)) 
} 

function* steps() { 
    console.log('fetching beers'); 
    const beers = yield ajax('http://api.react.beer/v2/search?q=hops&type=beer'); 
    console.log(beers); 

    console.log('fetching user'); 
    const user = yield ajax('https://api.github.com/users/[user]'); 
    console.log(user); 

    console.log('fetching fat joe'); 
    const fatJoe = yield ajax('https://api.discogs.com/artists/51988'); 
    console.log(fatJoe); 
} 

function getInfo() { 
    const dataGen = steps(); 
    for (const data of dataGen) { 
     console.log(data); 
    } 
} 

：私はこれに似た何かを探しています正しく出す。

提案がありますか？私はES6の機能や機能を使うことができますが、それ以上はありません。

ここで私は目のオプション、私が働いてもらうのが大好きですいずれかを実行しようとすると何が起こるかのために、ブラウザのコンソールでの出力です：

Answer 1

ここでトリッキーな部分がアヤックスということです関数は何も返しませんし、そうした場合、すぐにデータを返しません。

あなたが探していることをするには、私たちは約束のロジックをループに移さなければなりません。 ajax()を完全に削除して直接フェッチすることができます。

function* steps() { 
    const beers = yield fetch('http://api.react.beer/v2/search?q=hops&type=beer'); 
    const user = yield fetch('https://api.github.com/users/wesbos'); 
    const fatJoe = yield fetch('https://api.discogs.com/artists/51988'); 
} 

function getInfo() { 
    const dataGen = steps(); 
    for(const promise of dataGen) { 
    promise.then(data => data.json()).then(data => { 
     console.log(data); 
     dataGen.next(data); 
    }); 
    } 
} 

getInfo();