聊聊ES6中的generator

2022-08-28 09:36:11 字數 2219 閱讀 2071

generator

generator(生成器)是es6標準引入的新的資料型別。乙個generator看上去像乙個函式,但函式執行中間可以停止。

es6定義generator標準的哥們借鑑了python的generator的概念和語法。

話說回來,generator有什麼用呢,讓我們通過幾個函式來看一看它的作用:

//

普通函式——一路到底

function

show()

show();

這個函式執行後會彈出a 和 彈出b,那麼,我們能不能讓他在 彈出a之後停下呢,下面就需要借助我們的generator函式了。

//

generatro函式——中間能停

function *show()

show();

我們發現,這個函式名字前面 有個 * ,這就是generator函式的特點,當然了,*可以和函式名貼在一起,可以和function貼在一起,也可以誰都不貼,直接放中間,就是不能連起來寫,像這種

function*show() 

show();

現在generator函式有了,你得告訴它在哪停呀,有個東西叫 yield,又到了ask開心學英語時間,yield翻譯過來有屈服、投降、生產等意思,在咱們函式裡,取「放棄」的意思,簡單理解為暫時放棄控制權,等過一會再把控制權還給我。

//

generatro函式——中間能停

function*show()

show();

我們執行上面函式的時候發現,哎,函式沒有執行,也沒有報錯,這是咋回事呢?

這也是generator和普通函式的區別,當函式執行的時候,並不會執行函式裡面的內容,而是建立了乙個generator物件。

//

generatro函式——中間能停

function *show()

let genobj =show();

console.log(genobj);

//這裡面有個特別重要的方法

genobj.next(); //

對,就是這裡寫到的next()方法

這裡**執行的時候,會彈出a,我們在後面再寫乙個 next ,這樣執行的時候,會彈出a和b,說白了就是踹一腳走一步。

在這裡大家可能會奇怪了,我現在知道了generator配合yield可以讓函式走走停停,但我為什麼要讓它停呢,其實很簡答,就像我們平時坐計程車會讓師傅停下來等我們忙活其他的事,事情忙完之後再讓師傅繼續開一樣。generator和yield特別適用於請求資料的場景,下面看**:

function

函式())

}

正常來講,我們想用到請求來的一些資料,那麼就需要我們將用資料的**放在ajax請求成功之後, 然後就導致了我們所謂的**函式,**裡面還有**,最後產生了一大堆**。

function *函式()

而如果是generator函式,我們可以在請求資料的時候,可以讓函式暫停,等請求結束之後,函式再接著去執行,這樣就不用寫成**的那種方式。

上面兩段**,我們可以看出來,普通函式涉及到非同步操作的時候,我們只能通過**來寫,但在generator函式裡,我們可以等待資料請求結束,然後再去執行下面的函式。

那麼generator是如何做到讓函式走走停停的呢?這其實就是generator名字的由來,生成

function *show() 

function

show_1()

function

show_2()

let genobj =show();

console.log(genobj);

genobj.next();

//show_1()

genobj.next(); //

show_2()

拿我們第一次寫的函式來看吧,它將我們寫的乙個函式show,拆分成了兩個小函式,show_1,show_2,這樣就能實現我們看到的走走停停效果。

到這裡,generator函式的簡單運用,相信大家已經學會了,但是大家可能對文章中提到的yield不是特別了解,而yield也是generator中最不好理解的乙個東西,能不能把它掌握,很大程度上決定了我們學習generator的好壞,也是因為yield比較重要,打算放在下面一篇文章中,大家感興趣的話,可以繼續關注我哦

聊聊es6的解構

很多人會把解構跟es5的 相提並論,其實還是有一點區別的。在解構中,乙個重要的原則是,預設值生效的條件只有undefined。而使用es5的 由於js會把某些值都轉換成false,所以都會返回預設值。在js中,會轉換成false的值包括 false,0,null,undefined,nan,下面以陣...

ES6新特性之生成器函式 generator

一 什麼是生成器函式?生成器函式是es6的新特性之一,它是乙個在執行時能中途暫時退出,後面重新呼叫又能重新進入繼續執行的一種函式。並且在函式內定義的變數的所有狀態不受中途退出的影響。二 語法 宣告方式 function 函式名 引數1 引數2 引數n 呼叫說明 1 呼叫生成器物件時會返回乙個生成器的...

ES6系列 詳解ES6中的Map

map類似於物件,都用於儲存key value結構的資料。但是,在傳統的物件上,只能用字串或者symbol來作為鍵名。然而,map與物件最大的差別就在於它可以各種資料型別作為鍵名。map是乙個建構函式,用於例項化例項。const m newmap const o m.set o,content m....