首頁  >  文章  >  web前端  >  JavaScript中的Generator函數的用法介紹(附程式碼)

JavaScript中的Generator函數的用法介紹(附程式碼)

不言
不言轉載
2019-04-08 09:54:082945瀏覽

這篇文章帶給大家的內容是關於JavaScript中的Generator函數的用法介紹(附程式碼),有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。

語法上

首先可以把它理解成,Generator 函數是一個狀態機,封裝了多個內部狀態。執行 Generator 函數會傳回遍歷器對象,也就是說,Generator 函數除了狀態機,也是遍歷器物件產生函數。傳回的遍歷器對象,可以依序遍歷 Generator 函數內部的每一個狀態。

形式上

Generator 函數是一個普通函數,但是有兩個特徵。

一是,function關鍵字與函數名之間有一個星號;
二是,函數體內部使用yield表達式,定義不同的內部狀態(yield在英文裡的意思就是“產出”)。

呼叫上

Generator 函數的呼叫方法與普通函數一樣,也是在函數名稱後面加上一對圓括號。不同的是,在呼叫 Generator 函數後,函數並不執行,傳回的不是函數運行結果,而是指向內部狀態的指針對象,也就是上一章介紹的遍歷器物件(Iterator Object)。我們必須呼叫遍歷器物件的next方法,使得指標移向下一個狀態。也就是說,每次呼叫next方法,內部指標就會從函數頭部或上次停下來的地方開始執行,直到遇到下一個yield表達式(或return語句)為止。換言之,Generator 函數是分段執行的,yield表達式是暫停執行的標記,而next方法可以恢復執行

function* helloWorldGenerator() {
  yield 'hello';
  yield 'world';
  return 'ending';
}

var hw = helloWorldGenerator();
hw.next()
// { value: 'hello', done: false }

hw.next()
// { value: 'world', done: false }

hw.next()
// { value: 'ending', done: true }

hw.next()
// { value: undefined, done: true }

調用 Generator 函數,返回一個遍歷器對象,代表 Generator 函數的內部指針。以後,每次呼叫遍歷器物件的next方法,就會傳回一個有著value和done兩個屬性的物件。 value屬性表示目前的內部狀態的值,是yield表達式後面那個表達式的值;done屬性是一個布林值,表示是否遍歷結束。

yield表達式

yield表達式與return語句既有相似之處,也有差別。相似之處在於,都能傳回緊接在語句後面的那個表達式的值。差別在於每次遇到yield,函數暫停執行,下次再從該位置繼續往後執行,而return語句不具備位置記憶的功能。一個函數裡面,只能執行一次(或說一個)return語句,但是可以執行多次(或說多個)yield表達式。正常函數只能傳回一個值,因為只能執行一次return;Generator 函數可以傳回一系列的值,因為可以有任意多個yield。從另一個角度來看,也可以說 Generator 產生了一系列的值,也就是它的名稱的來歷(英文中,generator 這個字是「生成器」的意思)。

語法注意點:

1、yield表達式只能用在Generator 函數裡面

2、yield表達式如果用在另一個表達式之中,必須放在圓括號裡面

3、yield表達式用作函數參數或放在賦值表達式的右邊,可以不加括號。
例如:

function* demo() {
  foo(yield 'a', yield 'b'); // OK
  let input = yield; // OK
}

next 方法的參數

yield表達式本身沒有回傳值(就是說let a=yield ;會回傳undefined),或者說總是回傳undefined。 next方法可以帶一個參數,該參數就會被當作上一個yield表達式的回傳值 (注意,是表達式的回傳值,例如let a=yield..........參數會是a 的值並且會覆寫表達式之前的值)

function* f() {
  for(var i = 0; true; i++) {
    var reset = yield i;
    console.log(reset);
    if(reset) { i = -1; }
  }
}

var g = f();

g.next()

JavaScript中的Generator函數的用法介紹(附程式碼)

由於next方法的參數表示上一個yield表達式的回傳值,所以在第一次使用next方法時,傳遞參數是無效的。 V8 引擎直接忽略第一次使用next方法時的參數,只有從第二次使用next方法開始,參數才是有效的。從語意上講,第一個next方法用來啟動遍歷器對象,所以不用帶有參數。

【相關推薦:JavaScript影片教學

#

以上是JavaScript中的Generator函數的用法介紹(附程式碼)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文轉載於:segmentfault.com。如有侵權,請聯絡admin@php.cn刪除