Funkcje generatora w JavaScript są potężnym narzędziem, które pozwala funkcjom zwracać (“yield”) serię wartości na żądanie, co umożliwia tworzenie łatwych do zarządzania sekwencji oraz efektywne przetwarzanie danych bez konieczności ładowania wszystkich wartości do pamięci jednocześnie. W tej lekcji przyjrzymy się, jak poprawnie zdefiniować i używać wyrażeń funkcji generatora w JavaScript, zilustrowane przykładem kodu wplecionym w prosty dokument HTML.
Definicja funkcji generatora
Funkcje generatora w JavaScript definiuje się za pomocą specjalnego symbolu gwiazdki (*) umieszczonego między słowem kluczowym function a nazwą funkcji. Generator może przekazywać wartości za pomocą instrukcji yield i jest kontynuowany od miejsca, w którym został ostatnio wstrzymany, co pozwala na tworzenie skomplikowanych sekwencji wykonania w prosty i czytelny sposób.
Przykład kodu
Poniższy przykład ilustruje użycie funkcji generatora w JavaScript, który generuje ciąg Fibonacciego, wpleciony w prosty dokument HTML.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Funkcja generatora w JavaScript</title>
</head>
<body>
<script>
// Definicja funkcji generatora generującej ciąg Fibonacciego
function* generateFibonacci() {
let [prev, curr] = [0, 1];
while (true) {
[prev, curr] = [curr, prev + curr];
yield curr;
}
}
// Użycie funkcji generatora
const sequence = generateFibonacci();
console.log(sequence.next().value); // 1
console.log(sequence.next().value); // 1
console.log(sequence.next().value); // 2
console.log(sequence.next().value); // 3
console.log(sequence.next().value); // 5
// I tak dalej...
</script>
</body>
</html>
W powyższym przykładzie, funkcja generateFibonacci jest funkcją generatora, która w nieskończoność generuje kolejne liczby ciągu Fibonacciego. Użycie yield pozwala na pauzowanie funkcji i zwrócenie obecnej wartości curr bez zakończenia całej funkcji. Dzięki temu możemy “pytać” generator o kolejne liczby ciągu na bieżąco, bez potrzeby generowania ich wszystkich na raz.
Podsumowanie
Funkcje generatora w JavaScript oferują potężne możliwości do tworzenia efektywnych, łatwych w zarządzaniu sekwencji danych, które mogą być generowane i przetwarzane na żądanie. Poprzez umiejętne wykorzystanie słowa kluczowego yield, programiści mogą kontrolować wykonanie funkcji generatora, co otwiera drzwi do tworzenia bardziej złożonych i wydajnych aplikacji. Przykład z ciągiem Fibonacciego pokazuje, jak łatwo można implementować i używać funkcji generatorów w praktycznych zastosowaniach.
Jeżeli chcesz przyśpieszyć swoją naukę tworzenia stron chciałbym polecić mój kurs video JavaScript w którym nauczysz się tego języka od podstaw do zaawansowanych jego aspektów.