ユーザ用ツール

サイト用ツール


javascript:generator

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

両方とも前のリビジョン前のリビジョン
次のリビジョン
前のリビジョン
javascript:generator [2014/01/13 16:11] nullponjavascript:generator [2015/10/24 04:29] (現在) – 削除 nullpon
行 1: 行 1:
--====== Generator ====== 
- 
-Generator(ジェネレータ)はECMAScript 6で追加された新機能。 
- 
-ジェネレータは、内部の状態管理が必要となるIterator(イテレータ)の反復処理において、オブジェクトよりも簡単・安全に状態管理を行うための機能である。 
- 
-ジェネレータを用いた反復処理では「次の値の取り出し」と「取り出した値の処理」が交互に繰り返される。「次の値の取り出し」を行った後「取り出した値の処理」が完了するまでジェネレータ関数に記述された手続きの流れが一時中断される。 
- 
-今までのJavaScriptでは実現できなかった手続き途中での中断という動作が非同期処理のより良いコーディング手法として注目されている。 
- 
-===== ジェネレータの動作 ===== 
- 
-<code javascript> 
-function* f(i) { 
-  var y; 
-  y = yield ++i; 
-  console.log(y);        // => "a" 
-  y = yield ++i; 
-  console.log(y);        // => "b" 
-  y = yield ++i; 
-  console.log(y);        // => "c" 
-} 
- 
-var g = f(1);               // g => [Object: generator] 
-console.log(g.next());      // => { value: 2, done: false } 
-console.log(g.next("a"));   // => { value: 3, done: false } 
-console.log(g.next("b"));   // => { value: 4, done: false } 
-console.log(g.next("c"));   // => { value: undefined, done: true } 
-</code> 
- 
-  - キーワード ''function*'' でジェネレータ関数を定義 
-  - ジェネレータ関数を実行するとGeneratorオブジェクトが得られる 
-    * この時点ではジェネレータ関数の中身は実行されない 
-    * 引数 1 はジェネレータ関数に渡される 
-  - Generator#next が呼ばれると、ジェネレータ関数の最初の yield 式まで実行される。 
-    * Generator#next が { value: (yield 式の評価結果 === 2), done: false } を返す。 
-  - 再度 Generator#next が呼ばれる 
-    * 最初の yield が next の引数("a")を返す 
-    * ジェネレータ関数が次の yield 式まで実行される。 
-    * Generator#next が { value: (yield 式の評価結果 === 3), done: false } を返す。 
-  - 再度 Generator#next が呼ばれる 
-    * 二番目の yield が next の引数("b")を返す 
-    * ジェネレータ関数が次の yield 式まで実行される。 
-    * Generator#next が { value: (yield 式の評価結果 === 4), done: false } を返す。 
-  - さらに Generator#next が呼ばれる。 
-    * 三番目の yield が next の引数("c")を返す。 
-    * ジェネレータ関数の末尾まで実行される。 
-    * Generator#next が { value: undefined, done: true } を返す。 
- 
-===== ジェネレータの例 ===== 
- 
-フィボナッチ数列を生成するジェネレータ 
- 
-<code javascript> 
-function* fibonacci(limit = Infinity) { 
-    var count = 0; 
-    var a = 1; 
-    var b = 1; 
-    while(count++ < limit) { 
-        let c = a + b; 
-        a = b; 
-        b = c; 
-        yield c;         
-    } 
-} 
- 
-for (let i of fibonacci(5)) { 
-   console.log(i) 
-} 
-</code> 
-結果 
-<code> 
-2 
-3 
-5 
-8 
-13 
-</code> 
- 
-Rangeを生成するジェネレータ 
- 
-<code javascript> 
-function* range(a, b) { 
-    for(var i = a; i <= b; i++) { 
-        yield i; 
-    } 
-} 
- 
-for (let i of range(3,7)) { 
-   console.log(i) 
-} 
-</code> 
-結果 
-<code> 
-3 
-4 
-5 
-6 
-7 
-</code> 
- 
-===== 非同期処理 ===== 
- 
-ジェネレータを用いた非同期処理 
- 
-<code javascript> 
-var g = (function* () { 
-   console.log(1); 
-   var x = yield setTimeout(function() { console.log(2); g.next(3); }, 1000); 
-   console.log(x); 
-   var y = yield setTimeout(function() { console.log(4); g.next(5); }, 2000); 
-   console.log(y); 
-})(); 
-g.next(); 
-</code> 
-結果 
-<code> 
-1  // ここで1秒待つ 
- 
-3  // ここで2秒待つ 
-4 
-5 
-</code> 
  
javascript/generator.1389629507.txt.gz · 最終更新: 2014/01/13 16:11 by nullpon