Bu eğiticide, örnekler yardımıyla JavaScript oluşturucular hakkında bilgi edineceksiniz.
JavaScript'te, oluşturucular işlevler ve yineleyicilerle çalışmanın yeni bir yolunu sağlar.
Jeneratör kullanarak,
- işlevin herhangi bir yerinden bir işlevin yürütülmesini durdurabilirsiniz
- ve durdurulmuş bir konumdan kodu yürütmeye devam edin
JavaScript Oluşturucuları Oluşturun
Bir jeneratör oluşturmak için önce function*sembollü bir jeneratör işlevi tanımlamanız gerekir . Jeneratör fonksiyonlarının nesnelerine jeneratörler denir.
// define a generator function function* generator_function() (… ) // creating a generator const generator_obj = generator_function();
Not : Jeneratör işlevi ile belirtilir *. Bunları ya function* generatorFunc() (… )da function *generatorFunc()(… )oluşturmak için kullanabilirsiniz.
Yürütmeyi Duraklatmak için Getiri Kullanma
Yukarıda belirtildiği gibi, tüm işlev gövdesini yürütmeden bir jeneratör işlevinin yürütülmesini duraklatabilirsiniz. Bunun için yieldanahtar kelimeyi kullanıyoruz. Örneğin,
// generator function function* generatorFunc() ( console.log("1. code before the first yield"); yield 100; console.log("2. code before the second yield"); yield 200; ) // returns generator object const generator = generatorFunc(); console.log(generator.next());
Çıktı
1. ilk verimden önceki kod (değer: 100, tamamlandı: yanlış)
Buraya,
- Adlı bir jeneratör nesnesi
generatoroluşturulur. - Çağrıldığında
generator.next(), ilkine kadar olan kodyieldçalıştırılır. Ne zamanyieldkarşılaşıldığında, program değer döndürür ve jeneratör işlevi duraklar.
Not : Kullanmadan önce bir değişkene üretici nesneler atamanız gerekir.
Birden çok getiri beyanıyla çalışma
yieldİfade, bir değer verir. Ancak returnifadeden farklı olarak programı sonlandırmaz. Bu nedenle, son verilen konumdan itibaren kodu yürütmeye devam edebilirsiniz. Örneğin,
function* generatorFunc() ( console.log("1. code before first yield"); yield 100; console.log("2. code before the second yield"); yield 200; console.log("3. code after the second yield"); ) const generator = generatorFunc(); console.log(generator.next()); console.log(generator.next()); console.log(generator.next());
Çıktı
1. ilk verimden önceki kod (değer: 100, tamamlandı: yanlış) 2. ikinci verimden önceki kod (değer: 200, bitti: yanlış) (değer: tanımsız, tamamlandı: doğru)
İşte bu programın işleyişi.
- İlk
generator.next()ifade, kodu ilk verim ifadesine kadar yürütür ve programın yürütülmesini duraklatır. - İkincisi
generator.next(), programı duraklatılmış konumdan başlatır. - Tüm öğelere erişildiğinde, geri döner (değer: tanımsız, tamamlandı: doğru).
JavaScript'te oluşturucu işlevinin çalışması
Değişkenleri Oluşturucu İşlevlerine Aktarma
Ayrıca bir jeneratör işlevine bağımsız değişkenler de iletebilirsiniz. Örneğin,
// generator function function* generatorFunc() ( // returns 'hello' at first next() let x = yield 'hello'; // returns passed argument on the second next() console.log(x); console.log('some code'); // returns 5 on second next() yield 5; ) const generator = generatorFunc(); console.log(generator.next()); console.log(generator.next(6)); console.log(generator.next());
Çıktı
(değer: "merhaba", tamamlandı: yanlış) 6 bazı kodlar (değer: 5, tamamlandı: yanlış) (değer: tanımsız, tamamlandı: doğru)
Yukarıdaki programda,
- İlki
generator.next(),yield(bu durumda, "merhaba") değerini döndürür . Bununla birlikte, değer x değişkenine atanmaz.let x = yield 'hello';(değer: "merhaba", tamamlandı: yanlış)
- Ne zaman
generator.next(6)karşılaşıldığında, kod yeniden başlarlet x = yield 'hello';ve argüman 6 x atanır. Ayrıca kalan kod saniyeye kadar çalıştırılıryield.6 bazı kodlar (değer: 5, tamamlandı: yanlış)
- Üçüncüsü
next()çalıştırıldığında, program geri döner (değer: tanımsız, tamamlandı: doğru). Bunun nedeni, başka verim ifadelerinin olmamasıdır.(değer: tanımsız, tamamlandı: doğru)
Yinelemeleri Uygulamak için Oluşturucular Kullanılır
Üreteçler, yineleyicileri uygulamanın daha kolay bir yolunu sağlar.
Manuel olarak bir yineleyici uygulamak istiyorsanız, next()yöntemle bir yineleyici oluşturmalı ve durumu kaydetmelisiniz. Örneğin,
// creating iterable object const iterableObj = ( // iterator method (Symbol.iterator)() ( let step = 0; return ( next() ( step++; if (step === 1) ( return ( value: '1', done: false); ) else if (step === 2) ( return ( value: '2', done: false); ) else if (step === 3) ( return ( value: '3', done: false); ) return ( value: '', done: true ); ) ) ) ) for (const i of iterableObj) ( console.log(i); )
Çıktı
1 2 3
Üreteçler yinelenebilir olduğundan, bir yineleyiciyi daha kolay bir şekilde uygulayabilirsiniz. Ardından for… ofdöngüyü kullanarak üreteçler arasında yineleme yapabilirsiniz . Örneğin,
// generator function function* generatorFunc() ( yield 1; yield 2; yield 3; ) const obj = generatorFunc(); // iteration through generator for (let value of obj) ( console.log(value); )
Jeneratör Yöntemleri
| Yöntem | Açıklama |
|---|---|
next() | Bir getiri değeri verir |
return() | Bir değer verir ve oluşturucuyu sonlandırır |
throw() | Bir hata verir ve jeneratörü sonlandırır |
JavaScript dönüş Vs getiri Anahtar Kelime
| Anahtar Kelime döndür | anahtar kelime getir |
|---|---|
| Değeri döndürür ve işlevi sonlandırır. | Değeri döndürür ve işlevi durdurur, ancak işlevi sonlandırmaz. |
| Hem normal işlevlerde hem de jeneratör işlevlerinde mevcuttur. | Yalnızca jeneratör işlevlerinde mevcuttur. |
Dönüşlü JavaScript Oluşturucu Fonksiyonu
İfadeyi returnbir jeneratör işlevinde kullanabilirsiniz. returnDeyim bir değer döndürür ve (normal işlevlerine benzer) işlevini sona erer. Örneğin,
// generator function function* generatorFunc() ( yield 100; return 123; console.log("2. some code before second yield"); yield 200; ) // returns generator object const generator = generatorFunc(); console.log(generator.next()); console.log(generator.next()); console.log(generator.next());
Çıktı
(değer: 100, tamamlandı: yanlış) (değer: 123, tamamlandı: doğru) (değer: tanımsız, bitti: doğru)
Yukarıdaki programda returnifade ile karşılaşıldığında değeri döndürür ve doneözellik olur trueve fonksiyon sona erer. Dolayısıyla, ifadeden next()sonraki yöntem returnhiçbir şey döndürmez.
Not : Yukarıdaki kodda olduğu gibi ifade return()yerine yöntemi de kullanabilirsiniz .returngenerator.return(123);
JavaScript Oluşturucu Atma Yöntemi
Throw () yöntemini kullanarak jeneratör işlevinde açıkça bir hata atabilirsiniz. throw()Yöntemin kullanılması bir hata verir ve işlevi sonlandırır. Örneğin,
// generator function function* generatorFunc() ( yield 100; yield 200; ) // returns generator object const generator = generatorFunc(); console.log(generator.next()); // throws an error // terminates the generator console.log(generator.throw(new Error('Error occurred.'))); console.log(generator.next());
Çıktı
(değer: 1, tamamlandı: yanlış) Hata: Hata oluştu.
Jeneratörlerin Kullanım Alanları
- Jeneratörler, eşzamansız görevler yazarken daha temiz kod yazmamıza izin verir.
- Üreteçler, yineleyicileri uygulamanın daha kolay bir yolunu sağlar.
- Jeneratörler kodunu yalnızca gerektiğinde çalıştırır.
- Üreteçler bellek açısından verimlidir.
ES6'da jeneratörler tanıtıldı . Bazı tarayıcılar, jeneratörlerin kullanımını desteklemeyebilir. Daha fazla bilgi edinmek için JavaScript Generator desteğini ziyaret edin.
