ES6語法之Generator

Vultr 發布于2019-08-22 14:04 / 552人閱讀

摘要：不同的是，調用函數后，該函數并不執行，返回的也不是函數運行結果，而是一個指向內部狀態的指針對象，也就是上一章介紹的遍歷器對象。下一步，必須調用遍歷器對象的方法，使得指針移向下一個狀態。

Generator 函數

每當函數被調用時，JavaScript 引擎就會在函數頂部啟動，并運行每行代碼，直到到達底部。無法中途停止運行代碼，并稍后重新開始。一直都是這種“運行到結束”的工作方式.

如果我們希望能夠中途暫停運行函數，則需要使用 ES6 中新提供的一種函數，叫做 generator（生成器）函數！我們來看一個示例：

function* getEmployee() {
    console.log("the function has started");

    const names = ["Amanda", "Diego", "Farrin", "James"];

    for (const name of names) {
        yield name;
    }

    console.log("the function has ended");
}

注意到 function 關鍵字后面的星號（即 *）了嗎？星號表示該函數實際上是生成器！

關鍵字 yield 是 ES6 中新出現的關鍵字。只能用在生成器函數中。yield 會導致生成器暫停下來。函數體內部使用yield表達式，定義不同的內部狀態（yield在英語里的意思就是“產出”）。

現在看看當我們嘗試運行該函數時，會發生什么：

getEmployee();

// this is the response I get in Chrome:
getEmployee {[[GeneratorStatus]]: "suspended", [[GeneratorReceiver]]: Window}

結果是控制臺中沒有輸出我們所期待的，怎么回事呢？

事實上，生成器被調用時，它不會運行函數中的任何代碼，而是創建和返回迭代器。該迭代器可以用來運行實際生成器的內部代碼。

Generator 函數的調用方法與普通函數一樣，也是在函數名后面加上一對圓括號。不同的是，調用 Generator 函數后，該函數并不執行，返回的也不是函數運行結果，而是一個指向內部狀態的指針對象，也就是上一章介紹的遍歷器對象（Iterator Object）。

下一步，必須調用遍歷器對象的next方法，使得指針移向下一個狀態。也就是說，每次調用next方法，內部指針就從函數頭部或上一次停下來的地方開始執行，直到遇到下一個yield表達式（或return語句）為止。換言之，Generator 函數是分段執行的，yield表達式是暫停執行的標記，而next方法可以恢復執行。

const generatorIterator = getEmployee();
 generatorIterator.next();
 //{value: "Amanda", done: false}
 
 generatorIterator.next();
 //{value: "Diego", done: false}
 
 generatorIterator.next();
 //{value: "Farrin", done: false}

 generatorIterator.next();
 //{value: "James", done: false}
 
 generatorIterator.next();
 //{value: "undefined", done: true}

我們可以使用關鍵字 yield 從生成器中獲取數據。我們還可以將數據發送回生成器中。方式是使用 .next() 方法：

yield表達式本身沒有返回值，或者說總是返回undefined。next方法可以帶一個參數，該參數就會被當作上一個yield表達式的返回值。

 function* createSundae() {
    const toppings = [];

    toppings.push(yield);
    toppings.push(yield);
    toppings.push(yield);

    return toppings;
}
var it = createSundae();
it.next("hot fudge");
it.next("sprinkles");
it.next("whipped cream");
it.next().value();
// ["sprinkles","whipped cream",undefined]

使用數據調用 it.next("hot fudge");會將該數據發送到生成器函數中上次離開的地方。它會將 yield 關鍵字替換為你提供的數據。

GPU云服務器云服務器 Generator generator使用 generator數據類型 yeoman-generator

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

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

ES6&ES7中的異步之Generator的語法

摘要：第二次同理，遇到了第二個函數會停下來，輸出的遍歷器對象值為，的值依然是。比如返回的遍歷器對象，都會有一個方法，這個方法掛在原型上。這三個函數共同的作用是讓函數恢復執行。 Generator的語法 generator的英文意思是生成器簡介關于Generator函數，我們可以理解成是一個狀態機，里面封裝了多種不同的狀態。 function* gener(){ yield hel...

djfml 2019-08-21 16:57 評論0 收藏0
ES6 之 Iterator&Generator

摘要：可迭代對象就具有屬性，它是一種與迭代器密切相關的對象。它通過指定的函數可以返回一個作用于附屬對象的迭代器。迭代器特點每次調用方法時，返回一個數組，數組中兩個元素，分別表示鍵和值。示例之輸出輸出輸出之迭代器特點返回集合中存在的每一個鍵。 Iterator由來不推薦Iterator方法。 Iterator 函數是一個 SpiderMonkey 專有特性，并且會在某一時刻被刪除。有一點，需...

xietao3 2019-08-23 18:40 評論0 收藏0
ES6 系列之我們來聊聊 Async

摘要：標準引入了函數，使得異步操作變得更加方便。在異步處理上，函數就是函數的語法糖。在實際項目中，錯誤處理邏輯可能會很復雜，這會導致冗余的代碼。的出現使得就可以捕獲同步和異步的錯誤。如果有錯誤或者不嚴謹的地方，請務必給予指正，十分感謝。 async ES2017 標準引入了 async 函數，使得異步操作變得更加方便。在異步處理上，async 函數就是 Generator 函數的語法糖。 ...

Songlcy 2019-08-23 12:30 評論0 收藏0
探索Javascript 異步編程

摘要：因為瀏覽器環境里是單線程的，所以異步編程在前端領域尤為重要。除此之外，它還有兩個特性，使它可以作為異步編程的完整解決方案函數體內外的數據交換和錯誤處理機制。 showImg(https://segmentfault.com/img/bVz9Cy); 在我們日常編碼中，需要異步的場景很多，比如讀取文件內容、獲取遠程數據、發送數據到服務端等。因為瀏覽器環境里Javascript是單線程的，...

Salamander 2019-08-22 10:35 評論0 收藏0
使用JavaScript ES6的新特性計算Fibonacci（非波拉契數列）

摘要：采用的生成非波拉契數列提供了原生的支持，語法非常有特色，關鍵字后面緊跟一個星號。的詳細介紹參考官網先看如何用這個黑科技重新實現非波拉契樹立的生成。在這個內部，我們定義了一個無限循環，用于計算非波拉契數列。程序員面試系列 Java面試系列-webapp文件夾和WebContent文件夾的區別？程序員面試系列：Spring MVC能響應HTTP請求的原因？ Java程序員面試系列-什么...

yanbingyun1990 2019-08-23 12:29 評論0 收藏0