es6基礎0x016：生成器函數

ghnor 發布于2019-08-23 13:11 / 3048人閱讀

摘要：概述其實前幾章我都不知道怎么寫，因為他們總是涉及到一些比較深的東西，比如可迭代對象生成器迭代器之類的東西，等寫完這個系列，再好好整理一下這些東西可能會好一點，現在整理到哪兒就寫到哪兒吧語法使用作為聲明標識符，表示這是一個生成器函數是函數名是

0x000 概述

其實前幾章我都不知道怎么寫，因為他們總是涉及到一些比較深的東西，比如可迭代對象、生成器、迭代器之類的東西，等寫完這個系列，再好好整理一下這些東西可能會好一點，現在整理到哪兒就寫到哪兒吧

0x001 語法

function* name([param[, param[, ... param]]])
{ 
    statements 
}

使用function*作為聲明標識符，表示這是一個生成器函數

name是函數名

param是參數名，可以255個

statements是函數體

0x002 特點

生成器函數在執行的時候是可以暫停的，需要的時候再繼續執行

生成器函數返回的是一個迭代器對象，不會立即執行

生成器函數可以使用return，但是return之后將不可再迭代

0x003 栗子-無限id增長器

function* idMaker(begin=0){
  while(true)
    yield begin++;
}
let maker=idMaker(0)
console.log(maker.next().value) // 0
console.log(maker.next().value) // 1
console.log(maker.next().value) // 2
console.log(maker.next().value) // 3
...

說明：
調用生成器函數返回的是一個迭代器，迭代器是一個滿足迭代器協議的對象，簡單的說，迭代器對象有一定有一個next函數，該函數返回一個對象，我們稱之為迭代結果對象，該對象包含以下兩個屬性：

value：本次迭代的結果

done:布爾值，如果為true，表示無法再繼續迭代，如果為false，表示可以繼續迭代。

調用next函數，將會讓生成器函數真正的執行，一直執行，直到遇見yield，并返回迭代結果對象

0x004 栗子-有限id增長器

function* idMaker(begin=0){
  while(begin<3)
    yield begin++;
}
let maker=idMaker(0)
console.log(maker.next()) // {value: 0, done: false}
console.log(maker.next()) // {value: 1, done: false}
console.log(maker.next()) // {value: 2, done: false}
console.log(maker.next()) // {value: undefined, done: true}

如果函數執行完成了，那么done就自動變成true

0x005 next接收參數

function *createIterator() {
    let first = yield 1;
    let second = yield first + 2; // 4 + 2 
                                  // first =4 是next(4)將參數賦給上一條的
    yield second + 3;             // 5 + 3
}

let iterator = createIterator();

console.log(iterator.next());    // "{ value: 1, done: false }"
console.log(iterator.next(4));   // "{ value: 6, done: false }"
console.log(iterator.next(5));   // "{ value: 8, done: false }"
console.log(iterator.next());    // "{ value: undefined, done: true }"

這個解釋起來挺麻煩，第一次調用iterator.next()，返回1，代碼停在了yield 1，但是我們將yield 1的結果保存在了first變量中，其實這個操作是沒有發生的，當我們第二次執行iterator.next(4)，注意這里傳遞了一個參數4，此時會把4當做yield 1的返回值，賦值給first，所以第二次執行可以看做是let first=4的這么一個執行順序。

0x006 return

function* yieldAndReturn() {
  yield "1";
  return "2";
  yield "3"; 
}
var gen = yieldAndReturn()
console.log(gen.next()); // { value: "1", done: false }
console.log(gen.next()); // { value: "2", done: true }
console.log(gen.next()); // { value: undefined, done: true }

云服務器 GPU云服務器基礎函數 java快速生成函數 php生成文件的函數 ES6

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/99280.html

React入門0x016: 訪問Dom

摘要：概述不到必要不要在中訪問，嘗試使用的思想去解決問題。當然，必要的時候還是可以的，比如某些依賴的組件時機在中，并不是任何時候都可以訪問的，需要講究時機。 0x000 概述不到必要不要在React中訪問Dom，嘗試使用React的思想去解決問題。當然，必要的時候還是可以的，比如某些依賴Dom的組件 0x001 時機在React中，并不是任何時候都可以訪問Dom的，需要講究時機。因為Re...

NeverSayNever 2019-08-23 13:50 評論0 收藏0
JavaScript基礎: 類與繼承

摘要：類的方法相當于之前我們定義在構造函數的原型上。的構造函數中調用其目的就是調用父類的構造函數。是先創建子類的實例，然后在子類實例的基礎上創建父類的屬性。前言　　首先歡迎大家關注我的Github博客，也算是對我的一點鼓勵，畢竟寫東西沒法獲得變現，能堅持下去也是靠的是自己的熱情和大家的鼓勵。　　　　許久已經沒有寫東西了，因為雜七雜八的原因最近一直沒有抽出時間來把寫作堅持下來，感覺和跑步一...

liuchengxu 2019-08-22 15:42 評論0 收藏0
【JS基礎】ES6語法

摘要：遍歷器對象調用方法后，拋出的異常被函數體捕獲以后，會附帶執行下一條語句。 iterator迭代器在ES6之前遍歷數組的方法有以下四種： // 第一種 for(var i = 0; i < array.length; i++){ console.log(array[i]) } // 第二種 array.forEach(function(item,index){ cons...

Maxiye 2019-08-22 15:15 評論0 收藏0
webpack組織模塊的原理 - 基礎篇

摘要：每一個模塊的源代碼都會被組織在一個立即執行的函數里。接下來看的生成代碼可以看到，的源代碼中關于引入的模塊的部分做了修改，因為無論是，或是風格的，都無法被解釋器直接執行，它需要依賴模塊管理系統，把這些抽象的關鍵詞具體化。現在前端用Webpack打包JS和其它文件已經是主流了，加上Node的流行，使得前端的工程方式和后端越來越像。所有的東西都模塊化，最后統一編譯。Webpack因為版本的...

leiyi 2019-08-22 15:12 評論0 收藏0