JavaScript Oluşturucular

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 kod yieldçalıştırılır. Ne zaman yieldkarşı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şlar let x = yield 'hello';ve argüman 6 x atanır. Ayrıca kalan kod saniyeye kadar çalıştırılır yield. 
     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.

Ilginç makaleler...