yield是什么

• yield是ES6的新關(guān)鍵字，使生成器函數(shù)執(zhí)行暫停，yield關(guān)鍵字后面的表達(dá)式的值返回給生成器的調(diào)用者。它可以被認(rèn)為是一個(gè)基于生成器的版本的return關(guān)鍵字。
• yield關(guān)鍵字實(shí)際返回一個(gè)IteratorResult（迭代器）對象，它有兩個(gè)屬性，value和done，分別代表返回值和是否完成。
• yield無法單獨(dú)工作，需要配合generator(生成器)的其他函數(shù)，如next，懶漢式操作，展現(xiàn)強(qiáng)大的主動(dòng)控制特性。

yield應(yīng)用的簡單例子

demo1

• 如果你看到某個(gè)函數(shù)中有yield，說明這個(gè)函數(shù)已經(jīng)是個(gè)生成器了
• yield可以用來加強(qiáng)控制，懶漢式加載
• 調(diào)用函數(shù)指針和調(diào)用生成器是兩碼事，注意上面的運(yùn)行結(jié)果，countAppleSales和myArr。
• 需要next()函數(shù)配合使用，每次調(diào)用返回兩個(gè)值：分別是value和done，代表迭代結(jié)果和是否完成
• 函數(shù)next()是個(gè)迭代器對象，傳參可以缺省，默認(rèn)調(diào)用函數(shù)。

錯(cuò)誤的調(diào)用

demo2

上述錯(cuò)誤的調(diào)用中，會的到如下結(jié)果

{ value: 7, done: false }

{ value: undefined, done: true }

因?yàn)樵趙hile判斷中的next也會進(jìn)行消耗，導(dǎo)致輸出結(jié)果與預(yù)期不符，得到的只是符合條件的偶數(shù)項(xiàng)

一些說明

• yield并不能直接生產(chǎn)值，而是產(chǎn)生一個(gè)等待輸出的函數(shù)
• 除IE外，其他所有瀏覽器均可兼容（包括win10 的Edge）
• 某個(gè)函數(shù)包含了yield，意味著這個(gè)函數(shù)已經(jīng)是一個(gè)Generator
• 如果yield在其他表達(dá)式中，需要用()單獨(dú)括起來
• yield表達(dá)式本身沒有返回值，或者說總是返回undefined(由next返回)
• next()可無限調(diào)用，但既定循環(huán)完成之后總是返回undeinded

next()函數(shù)及參數(shù)

• 在js中，雖然借鑒了python的函數(shù)，但是也進(jìn)行了自己的改造，由于沒有send()函數(shù)，所以無法直接傳遞yield的值。
• next()可以帶一個(gè)參數(shù)，該參數(shù)會被認(rèn)為是上一個(gè)yield整體的返回值，稍后將在代碼中展示。
• 在某種程度上，next()可以直接當(dāng)做send()使用

它的意義在于，可以在不同階段從外部直接向內(nèi)部注入不同的值來調(diào)整函數(shù)的行為(這一點(diǎn)是其他循環(huán)很難做到的，或要付出較大的代價(jià)才可以做到)

yield參數(shù)的對比

js

python

• 對js中g(shù)enerator函數(shù)進(jìn)行改造，對比右邊的python中的yield，它們原理一樣，只是調(diào)用方式不同
• 調(diào)用next()，會產(chǎn)生許多i的值, 但是不會影響reset，因?yàn)閥ield直接將值return出來了。
• 當(dāng)傳值true后，yield及他的參數(shù)整體變?yōu)閠rue賦值給reset，這是reset會被執(zhí)行，從而滿足循環(huán)內(nèi)的判斷條件
• 這里的使用 next(參數(shù)) 已經(jīng)達(dá)到了send(參數(shù))的效果
• 這并不會平白增加循環(huán)的時(shí)間復(fù)雜度，因?yàn)椴粋鲄⒌臅r(shí)候，并不會占用更多的內(nèi)存

更深層次的理解yield

如果剛才沒有讓你有一個(gè)清晰的認(rèn)識，那么這個(gè)例子一定會讓你徹底明白的

傳參

分析

next() 傳參是對yield整體的傳參，否則yield類似于return

A組

• x恒為5，所以第一次調(diào)用傳空沒問題，可得到對應(yīng)的第一個(gè)yield返回值:yield (x + 1)
• 第二次調(diào)用，無參數(shù)傳入，所以y為NaN(2* undefined)，自然得不到z
• 第三次調(diào)用同上分析

B組

• x恒為5，所以第一次調(diào)用傳空沒問題，可得到對應(yīng)的第一個(gè)yield返回值:yield (x + 1)
• 第二次調(diào)用，傳入12，所以y為24(yield (x + 1)=入?yún)?，得到第二個(gè)yield: yield (y / 3)=8
• 第三次調(diào)用同上分析,得到最后的z值并return=42

目前項(xiàng)目中的可用性

在前端項(xiàng)目中，用的機(jī)會很少，完全可以忽略他的存在，但是在后臺項(xiàng)目中，就顯得比較重要了，因?yàn)槠鋬?yōu)越的可控性，可是極大的提升線程的效率。

目前只是根據(jù)官網(wǎng)，ES6規(guī)范，大站等總結(jié)出來的，但是很遺憾，目前我們的項(xiàng)目中由于node項(xiàng)目較簡單，并不需要進(jìn)行實(shí)際改造。

如果需要實(shí)例的話，可參考github上的一些python后端項(xiàng)目，調(diào)用方式稍有不同，由于js參考的python語言，他們又同為動(dòng)態(tài)語言，所以原理都是相同的，用處也一樣。

以上就是js中yield參數(shù)應(yīng)用示例深入理解的詳細(xì)內(nèi)容，更多關(guān)于js yield參數(shù)應(yīng)用的資料請關(guān)注腳本之家其它相關(guān)文章！

最新評論