ジェネレータ関数[ES6シリーズ-07の場合]:ファンクション・ジェネレータ

[オリジナル]コード道路の労働者Coderのパワー

みなさん、こんにちは、ここでは道路の労働者が力を持っているコードがある、私はあなたがパワーある、ヤード道路労働者です。

githubの-ページは、
パークcnblogsブログ


Generator function 生成器函数されES6、本質的に、あなたが得るプログラム、素人の観点から、プロセス制御、キックキック、ステップの実行を制御のエンコーディングは、しないように、歩行器の形にパッケージ化する新しい構文糖でありますあまりにも暴力的な〜

0.はじめに

ジェネレータ関数に言って、あなたが言及する必要がありjavascript、プログラムの非同期の進化の歴史を。

(脱線ありません脱線ない脱線しません)

  • 1.コモンモードコールバック関数(コールバック)
  • 2.イベント/パブリッシャ - サブスクライバモデル(イベント/出版 - オブザーバー)
  • 3.Promise
  • 4.Generator
  • 5.async /(正式ES8 / ES2017で提案されている)待ちます

これはPromise、コールバック関数が入れ子になったときに解決マイルストーンであるcallback hellコールバック地獄の問題(読み取りおよび維持するためにあまりにもハードネストされた階層)。

そして、主人公はGenerator起動時に、複数の遷移として構文のようなものですasync/await基本はほとんど使用されません後。

async/await、CSharperが正面を回し、それが自分の愛する人を見ることのように見え、C#同じ構文を持っています。(#注:C#5.0の添加)

本当に便利なああに文法進化を言います。リアに記事を分離することPromiseと、async/await開口部のペースト。

1.自分自身の文章を紹介

1.1の話はあなたのコードを示し、安価です!

/* eg.0
 * Simple Example of Generator-Function
 */
//----------------------------------------

let songs = ["Hero", "Here I am", "The Show"]

// Generator-Function is Here Below:
function *play(songs) {
    for(let i=0; i<songs.length; i++) {
        yield songs[i]
    }
    // 这里可以有return
}

let g = play(songs)

let next = g.next()
console.log(next)   // { value: 'Hero', done: false }

next = g.next()
console.log(next)   // { value: 'Here I am', done: false }

next = g.next()
console.log(next)   // { value: 'The Show', done: false }

next = g.next()
console.log(next)   // { value: undefined, done: true }

//----------------------------------------

1.2ジェネレータ関数の定義

  • まず、機能を持つように定義され*たシンボルを。

    *どちらのすぐfunction背後にある、それはまた、関数名の前に取り付けることができます。

  • 第二に、内の関数があるyieldキーワードは、

    処理を中断し、かつ外国一時的な値のリターンを提供することができます。

  • 関数を書く普通のと何ら変わり、その他

ジェネレータ関数を使用して約1.3

  • 1.通常の関数呼び出しと同じように、任意の特定の戻り値が、イテレータを取得できません。(また、状態機械とみなすことができます)

  • 2.キックするようにしてください。呼び出すことによって得られたイテレータオブジェクトnext()方法は、開始値は、最初のオブジェクトが返され得ます。

  • 3.キックをしてください。すべての呼び出しnext()結果オブジェクトを取得する方法を、あなたは、コメント上記のコードで印刷情報を見ることができます。

    ここでvalue、現在利用可能な値done、すなわち、反復状態は、それが唯一持っているture/false、それがなったときに、二つの可能性をtrue反復が完了したこと。

2.主流の使用

それはフィットする必要がありますグッドプラクティスそれを、使用する通常の方法でpromise使用します。

簡単な例には:

/* eg.1
 * Simple Example of Generator-Function
 */
//----------------------------------------

function* func() {
    // 这里应该是ajax请求,结果是一个promise对象,简单模拟一下
    yield new Promise(function(resolve,reject){
        resolve('Hello')
    })
    
    // 这里应该是ajax请求,结果是一个promise对象,简单模拟一下
    yield new Promise(function(resolve,reject){
        resolve('World')
    })
}

let g = func()

g.next().value.then((data) => {
    console.log('log-1:', data)
    return g.next().value
}).then((data) => {
    console.log('log-2:', data)
})

// log-1: Hello
// log-2: World

//----------------------------------------

このように、それは非同期になりajax、単純な方法の同期を書き込むことで処理。

3.謙虚な練習

非同期の処理に加えて、庭の労働者は個人的に、そのように感じGeneratorループ処理の現場での使用に適して。ここで、この方法の実施には、次の例のように:

/* eg.2 (part1)
 * My Example of Generator-Function
 */
//----------------------------------------
// 以下代码中都省略掉了检测处理

// 首先来一个Gernerator函数
function *getDateInPeriod(from, to, includEnd=false) {

    let fromDate = new Date(from)
    let toDate = new Date(to)

    if(includEnd) {
        toDate = addDays(toDate, 1)
    } 

    for(let date = fromDate;date < toDate; date=addDays(date, 1)) {
        yield date
    }
}

// 上面调用到了工具函数addDays
function addDays(date, days){
    date = new Date(date.setDate(date.getDate() + days))
    return date
}

//----------------------------------------

次いで使用は、値の周期の過程で、ビジネスプロセス(同期または非同期)の数が存在することになります。

/* eg.2 (part2)
 * My Example of Generator-Function
 */
//----------------------------------------

let arrDate = getDateInPeriod('2019-06-06', '2019-06-30', true)

let daysInPeriod = arrDate.next()

while(!daysInPeriod.done) {

    // 这里是一堆其它业务处理

    console.log(daysInperiod)

    daysInPeriod = arrDate.next()

}
console.log(daysInperiod)

//----------------------------------------

情報結果を印刷:

{ value: 2019-06-06T00:00:00.000Z, done: false }
{ value: 2019-06-07T00:00:00.000Z, done: false }
...
{ value: 2019-06-29T00:00:00.000Z, done: false }
{ value: 2019-06-30T00:00:00.000Z, done: false }
{ value: undefined, done: true }

上記の例で、または同期。そうでないかもしれない良い使用が、私は、これは使用法であることを伝えることができます。

4.練習のことを聞きました

作業コードは、効果も実施されていないGeneratorこの構文に応じて砂糖の関数yieldように非同期プログラミング快適、制御処理を簡略化するために、パッケージので、アクチュエータ機能、複数の部分にコードが、それぞれの人が手動制御部を実行します。

実際には、とasync/awaitこの後に本当に必要ではありません。

co.jsつまり、そのようなGenerator実行ライブラリー)

4.その他

上記のジェネレータ関数の主な用途に加えて、ほとんど理解があることができ、どのように使用するかを感じていない、練習していなかった他の小さなポイント機能、コードや道路の労働者もあります。

4.1によって受信されるnextパラメータに転送。

/* eg.3
 * parameters
 */
//----------------------------------------

function *genFunc(p) {
    console.log(`p is ${p}`)

    let p1 = yield p
    console.log(`p1 is ${p1}`)

    let p2 = yield p1
    console.log(`p2 is ${p2}`)
}


let gen = genFunc(1)
// 第一次next无法传参到Generator函数,应该由最初的函数调用处传递
gen.next(2)

// 从第二步next() 传的参数,在第一个yield处接收
gen.next(3)

するのに約yieldパラメータを渡すことは奇妙な感じ、実際には、少し奇妙に見える理解していません。

上記の説明では、コメントを投稿されています。

4.2は、デフォルトのイテレータを持っていること

/* eg.4
 * get value by for-of loop
 */
//----------------------------------------

function *foo() {
    for(let i=0; i<6; i++) {
        yield i
    }
}

let gen = foo()

for(let item of gen) {
    console.log(item)
}

// 打印结果:
// 0
// 1
// 2
// 3
// 4
// 5
//----------------------------------------

概要

約ジェネレータ関数はGenerator Function、今ここで紹介します

これは、その上に糖衣構文を意識することで、とにかく、将来は必ずしも実際に取得するために使用されていません

非同期処理は、主に使用されているPromiseasync/await

上記。

私は、あなたは次の時間、あなたは助けることができると思います。

-終わり-


おすすめ

転載: www.cnblogs.com/CoderMonkie/p/ES6-Generator-Function.html