生成器(Generator)是JavaScript ES6引入的特性,它讓我們可以分段執(zhí)行一個(gè)函數(shù)。
但是在談?wù)撋善鳎℅enerator)之前铲觉,我們要先了解迭代器(Iterator)澈蝙。
迭代器(Iterator)
迭代器(Iterator)并非JavaScript的特性,而是一種概念撵幽,需要我們自己實(shí)現(xiàn)灯荧。
先看下面一段代碼:
let numbers = [1, 2, 3];
for (let i = 0; i < numbers.length; i++) {
console.log(numbers[i]);
}
這段代碼的作用是遍歷數(shù)組(array)numbers
中所有元素。現(xiàn)在我們使用迭代器的方式來(lái)遍歷它盐杂。
首先我們需要自己實(shí)現(xiàn)一個(gè)迭代器(Iterator):
function makeIterator(array){
var nextIndex = 0;
return {
next: function(){
return nextIndex < array.length ?
{value: array[nextIndex++], done: false} :
{done: true};
}
};
}
接下來(lái)逗载,我們要使用我們剛剛實(shí)現(xiàn)的迭代器來(lái)遍歷數(shù)組:
let it = makeIterator([1, 2, 3]);
console.log(it.next()); // {value: 1, done: false}
console.log(it.next()); // {value: 2, done: false}
console.log(it.next()); // {value: 3, done: false}
console.log(it.next()); // {done: true}
可以看到,每調(diào)用一次it.next()
况褪,就可以獲取到一個(gè)值撕贞,同時(shí)可以通過(guò)done
屬性知道是否已經(jīng)遍歷完畢。
生成器(Generator)
講完迭代器测垛,我們?cè)賮?lái)看一看生成器(Generator)捏膨。簡(jiǎn)單來(lái)說(shuō),生成器(Generator)就是一個(gè)自帶迭代器(Iterator)的函數(shù)食侮。
一個(gè)簡(jiǎn)單的例子如下:
function* printOneToThree() {
yield 1;
yield 2;
yield 3;
}
let it = printOneToThree();
console.log(it.next()); // {value: 1, done: false}
console.log(it.next()); // {value: 2, done: false}
console.log(it.next()); // {value: 3, done: false}
console.log(it.next()); // {value: undefined, done: true}
可以看到号涯,我們每調(diào)用一次it.next()
語(yǔ)句,就會(huì)運(yùn)行一個(gè)yield
表達(dá)式锯七,直到所有的yield
表達(dá)示全部運(yùn)行完畢链快。如此一來(lái),我們?nèi)玳_(kāi)篇所說(shuō)眉尸,具有了分段執(zhí)行一個(gè)函數(shù)的能力域蜗。
更多關(guān)于生成器(Generator)的探討請(qǐng)參見(jiàn):