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.yieldanahtar 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 sonrakiyielde 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,
sequenceGeneratorsonsuz 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)venext(10)kendi değerlerini üreteç fonksiyonuna gönderir veyield num1 + num2bu 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,
throwyö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,yieldtarafından döndürülen değerin türüdür.ReturnType,returntarafı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 veyieldile 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()vethrow()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.