眾所周知，JavaScript 是一種輕量級程式語言，ECMAScript 2015 中引入了生成器。生成器是一個具有許多輸出值並且可以停止和啟動的進程。在 JavaScript 中，生成器由生成器函數組成，該函數會產生可迭代的生成器物件。
在本文中，我們將詳細討論 JavaScript 中的生成器以及 JavaScript 中不同類型的生成器，並詳細介紹語法和範例。
JavaScript 中的生成器簡介
生成器的功能與常規功能相同，但有一點不同，生成器功能可以恢復和暫停。一般來說，在 JavaScript 中，函數一旦被呼叫就不會停止。通常，生成器的概念出現在非同步程式設計中。
JavaScript 中生成器函數的語法
現在我們將討論 JavaScript 中生成器函數的語法，並將其與常規函數進行比較。
function * 語法用於建立生成器函數，yield 關鍵字用於暫停它們。
function * genFunc() {
yield 'Hello';
yield 'World';
}
const g = genFunc(); // g is a generator
g.next(); // { value: 'Hello', done: false }
g.next(); // { value: 'World', done: false }
g.next(); // { value: undefined, done: true }
…
登入後複製
當第一次呼叫生成器函數時，不會執行其任何程式碼，而是傳回一個生成器物件。透過呼叫生成器的 next() 方法來消耗值，該方法運行程式碼直到遇到yield 關鍵字，此時它會暫停並等待，直到再次呼叫 next()。
在上面的程式碼中，在我們的最終語句之後，連續呼叫g.next() 將只會產生相同的回傳物件：{value: undefined, did: true}，因為我們在我們的程式碼中的'world' 之後沒有定義任何東西。 genFunc() 函數。
yield 關鍵字暫停生成器函數的執行，並向生成器的呼叫者提供其後面的表達式的值。它與基於生成器的 return 關鍵字版本相當。只能從包含yield的生成器函數中直接呼叫。
與常規函數比較
function regFunc() {
console.log("Hello World");
}
// Hello World
登入後複製
在常規函數中，我們不使用「*」函數，正如您在上面的範例中看到的那樣，它也不使用yield函數。正如我們上面討論的，常規函數和生成器函數之間的主要區別在於生成器函數可以停止和暫停。所以透過上面的例子，你可以看到我們沒有選擇停止它，而是直接列印整個語句，即「Hello world」。
正如我們已經了解了生成器函數的基礎知識，現在讓我們轉向不同類型的生成器函數 -
普通生成器
在普通生成器中，生成器充當迭代器，在執行每次 next() 方法呼叫以產生函數後產生下一個值。讓我們來看一個例子，我們將一一產生數字，直到清單結束。
function* generator_function(){
for(var cur = 0 ; cur<7; cur++){
yield cur;
}
}
var object_generator = generator_function();
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
登入後複製
在上面的程式碼中，我們建立了一個普通的通用函數，其中包含yield關鍵字，並使用next()函數多次呼叫它。
帶參數的生成器
帶有參數的生成器與普通生成器有點不同，這次我們必須使用 next() 函數傳遞一個參數，將其發送到生成器函數。此外，每次我們傳遞一個參數時，它都會儲存在yield關鍵字之後，而不是之前，我們將在接下來的範例中理解這個概念 -
function* generator_function(){
console.log("start of the function")
temp = yield;
console.log("This is the first value passed: " + temp)
temp = yield;
console.log("This is the second value passed: " + temp)
}
var object_generator = generator_function();
object_generator.next("This is not the first ");
object_generator.next("this is first");
object_generator.next("this is second");
object_generator.next();
登入後複製
在上面的程式碼中，我們定義了生成器函數，這次我們將參數傳遞給它。當我們第一次呼叫該物件時，不會列印給定的參數，因為這是在「yield」關鍵字之前發送的，然後在發送的值儲存在變數中並列印之後，在第二次列印值之後，不會發生任何事情，因為沒有產量目前。
具有物件屬性的生成器
生成器可以用作對象，當我們呼叫它們時，它們只會傳回分配給它們並且可以列印的值。為了理解這個概念，讓我們來看一個例子。
function* generator_function(){
yield "First value"
yield "Second value"
yield "Third value"
}
var object_generator = generator_function();
console.log(object_generator.next().value);
console.log(object_generator.next().value);
console.log(object_generator.next().value);
登入後複製
在上面的程式碼中，首先，我們定義了三個yield表達式，它們後面有一個字串，當我們呼叫生成器時，它們後面的字串將被傳回。
還有其他類型的生成器，例如傳回類型，有些生成器內部包含另一個生成器，等等。
結論
在文章中，我們了解到生成器的功能與常規功能相同，但有一點不同，生成器功能可以恢復和暫停。一般來說，在 JavaScript 中，函數一旦被呼叫就不會停止。通常，生成器的概念出現在非同步程式設計中。生成器有多種類型，例如普通生成器，帶有參數、屬性等物件、生成器包含另一個生成器等。
以上是解釋 JavaScript 中不同類型的生成器的詳細內容。更多資訊請關注PHP中文網其他相關文章！
