TypeScript'te Üreteç Fonksiyonları

TypeScript'te Üreteç Fonksiyonları

Bu makale, TypeScript'teki üreteç fonksiyonlarını açıklar.

Jeneratör fonksiyonlarının nasıl kullanılacağına dair temellerden, asenkron işlemlerle birleştirilmiş ileri seviye örneklere ve kod örneklerine kadar her şeyi öğrenebilirsiniz.

YouTube Video

Üreteç Fonksiyonları

TypeScript'teki üreteç fonksiyonları, JavaScript'in üreteç fonksiyonlarına benzer işlevsellik sunar. Üreteç fonksiyonları, function* (bir yıldız işareti ile birlikte bir fonksiyon bildirimi) kullanılarak tanımlanır ve normal fonksiyonlardan farklı olarak işlemi duraklatıp devam ettirebilen özel fonksiyonlardır.

Bir üreteç fonksiyonu çağrıldığında, bir iterator döndürülür; bu iterator ile tek tek değerler üretilir, ve yield anahtar kelimesi kullanılarak işlem durdurulabilir ya da dışarıdan değerler gönderilebilir.

Üreteç Fonksiyonlarının Temel Söz Dizimi

 1function* myGenerator(): Generator<number, void, unknown> {
 2    yield 1;
 3    yield 2;
 4    yield 3;
 5}
 6
 7const gen = myGenerator();
 8
 9console.log(gen.next().value); // 1
10console.log(gen.next().value); // 2
11console.log(gen.next().value); // 3
12console.log(gen.next().done);  // true (Iteration finished)
  • function* myGenerator() ile bir üreteç fonksiyonu tanımlayın.
  • yield anahtar kelimesi, bir değer döndürürken fonksiyonun işlemini durdurur.
  • Her next() yöntemi çağrıldığında, üreteç fonksiyonunun işleyişi devam eder ve bir sonraki yielde ilerler.

next() bir sonraki değeri ve bir done özelliğini içeren bir nesne döndürür. done değeri true olduğunda, tüm değerlerin üretildiğini ve üretecin işleminin tamamlandığını gösterir.

Üreteç Fonksiyonlarının Uygulamaları

Üreteç fonksiyonlarının kullanımı, ardışık işlemlerin kolayca temsil edilmesini sağlar. Aşağıdaki örnekte, bir sayı dizisi üreten bir üreteç fonksiyonu oluşturuyoruz.

 1function* sequenceGenerator(start: number = 0, step: number = 1) {
 2    let current = start;
 3    while (true) {
 4        yield current;
 5        current += step;
 6    }
 7}
 8
 9const seq = sequenceGenerator(1, 2);
10
11console.log(seq.next().value); // 1
12console.log(seq.next().value); // 3
13console.log(seq.next().value); // 5
  • Bu örnekte, sequenceGenerator sonsuz derecede artan bir sayı dizisi üretir. yield, her adımda değer döndürmek ve sonraki çağrılarda bir sonraki değeri üretmek için kullanılır.

Değerleri next'e Geçirme

next() yöntemi bir değer alabilir ve bu, üreteç fonksiyonuna gönderilebilir.

 1function* adder() {
 2    const num1 = yield;
 3    const num2 = yield;
 4    yield num1 + num2;
 5}
 6
 7const addGen = adder();
 8addGen.next();          // Initialization
 9addGen.next(5);         // Set 5 to num1
10const result = addGen.next(10).value; // Set 10 to num2 and get result
11console.log(result);    // 15
  • Bu örnekte, next(5) ve next(10) kendi değerlerini üreteç fonksiyonuna gönderir ve yield num1 + num2 bu değerlerin toplamını döndürür.

return ve throw

  • return(value) üreteç fonksiyonunu sonlandırabilir ve belirtilen değeri döndürebilir.
  • throw(error), üreteç içinde bir exception fırlatabilir ve üreteç içindeki istisnaların işlenmesinde kullanılır.
 1function* testGenerator() {
 2    try {
 3        yield 1;
 4        yield 2;
 5    } catch (e) {
 6        console.error("Error caught:", e);
 7    }
 8}
 9
10const gen = testGenerator();
11console.log(gen.next().value); // 1
12gen.throw(new Error("An error occurred!")); // Error caught: An error occurred!
  • Bu örnekte, throw yöntemi üreteç içinde bir hata üretmek için kullanılır ve bu hata üreteç içinde yakalanır.

TypeScript'te Tür Tanımlaması

Bir jeneratör fonksiyonunun tür tanımı aşağıdaki formatta belirtilebilir.

1// Generator<YieldType, ReturnType, NextType>
2function* myGenerator(): Generator<number, void, unknown> {
3    yield 1;
4    yield 2;
5    yield 3;
6}
  • Türleri Generator<YieldType, ReturnType, NextType> formatında belirtirsiniz.
    • YieldType, yield tarafından döndürülen değerin türüdür.
    • ReturnType, return tarafından döndürülen değerin türüdür.
    • NextType, next() yöntemine iletilen değerin türüdür.

Aşağıdaki örnekte, jeneratörü türlerle güvenli bir şekilde kullanmak için belirli türler belirtilmektedir.

 1function* numberGenerator(): Generator<number, void, number> {
 2    const num1 = yield 1;
 3    const num2 = yield num1 + 2;
 4    yield num2 + 3;
 5}
 6
 7const gen = numberGenerator();
 8
 9console.log(gen.next().value);   // 1
10console.log(gen.next(10).value); // 12 (10 + 2)
11console.log(gen.next(20).value); // 23 (20 + 3)

Jeneratörler ve Asenkron İşlem

Jeneratörler asenkron işlem için de kullanılabilir. Örneğin, ardışık işlem yaparken asenkron işlemlerin sonuçlarını beklemek için yield kullanabilirsiniz. Ancak, TypeScript ya da JavaScript'te async/await daha yaygın olarak kullanılır.

1function* asyncTask() {
2    const result1 = yield fetch("https://codesparklab.com/json/example1.json");
3    console.log(result1);
4
5    const result2 = yield fetch("https://codesparklab.com/json/example2.json");
6    console.log(result2);
7}

Bu yüzden, jeneratörlerle asenkron işlemleri sırayla işleyebilmenize rağmen, Promises ve async/await daha kullanışlı olduğu için asenkron işlemde pek kullanılmazlar.

Özet

  • Jeneratör fonksiyonları, function* ile tanımlanan ve yield ile değer döndürürken fonksiyonun çalışmasını duraklatan özel fonksiyonlardır.
  • Jeneratörü devam ettirmek ve değer almak için next() kullanın. Ayrıca, next(value) kullanarak jeneratöre değer iletebilirsiniz.
  • Jeneratör fonksiyonlarını sonlandırmak veya hataları yönetmek için return() ve throw() kullanabilirsiniz.
  • TypeScript'te jeneratörleri kullanırken, tür tanımlamalarını kullanarak tür güvenliği olan kodlar yazabilirsiniz.

Jeneratörler, yinelemeyi esnek bir şekilde kontrol etmenizi sağlayan güçlü araçlardır.

Yukarıdaki makaleyi, YouTube kanalımızda Visual Studio Code'u kullanarak takip edebilirsiniz. Lütfen YouTube kanalını da kontrol edin.

YouTube Video