JavaScript Yineleyiciler ve Yinelemeler

Bu eğitimde, örnekler yardımıyla JavaScript yineleyicileri ve yinelemeleri öğreneceksiniz.

JavaScript Yinelemeler ve Yineleyiciler

JavaScript, veri yapıları üzerinde yineleme yapmak için bir protokol sağlar. Bu protokol, bu veri yapılarının for… ofdöngü kullanılarak nasıl yinelendiğini tanımlar .

Protokol kavramı şunlara ayrılabilir:

  • tekrarlanabilir
  • yineleyici

Yinelenebilir protokol, bir yinelenebilir Symbol.iteratoranahtarın olması gerektiğini belirtir .

JavaScript Yinelemeleri

Symbol.iterator()Yönteme sahip olan veri yapıları yinelenebilir olarak adlandırılır. Örneğin, Diziler, Dizeler, Kümeler vb.

JavaScript Yineleyiciler

Yineleyici, Symbol.iterator()yöntem tarafından döndürülen bir nesnedir .

Yineleyici protokolü next(), yinelenebilir (veri yapısı) her bir öğeye birer birer erişme yöntemi sağlar .

Tekrarlanabilir bir örneğe bakalım. Symbol.Iterator()

 const arr = (1, 2 ,3); // calling the Symbol.iterator() method const arrIterator = arr(Symbol.iterator)(); // gives Array Iterator console.log(arrIterator); const str = 'hello'; // calling the Symbol.iterator() method const strIterator = str(Symbol.iterator)(); // gives String Iterator console.log(strIterator);

Çıktı

 Dizi Yineleyici () StringIterator ()

Burada, Symbol.iterator()hem dizinin hem de dizenin yöntemini çağırmak, ilgili yineleyicileri döndürür.

Yinelemeler aracılığıyla yineleyin

for… ofBu yinelenebilir nesneler arasında yineleme yapmak için döngüyü kullanabilirsiniz . Aşağıdaki Symbol.iterator()gibi bir yöntemle yineleyebilirsiniz :

 const number = ( 1, 2, 3); for (let n of number(Symbol.iterator)()) ( console.log(n); )

Çıktı

 1 2 3

Veya diziyi şu şekilde yineleyebilirsiniz:

 const number = ( 1, 2, 3); for (let n of number) ( console.log(n); )

Burada yineleyici, for… ofdöngünün bir dizi üzerinde yinelenmesine ve her bir değeri döndürmesine izin verir .

JavaScript next () Yöntem

Yineleyici nesnesi, sıradaki bir next()sonraki öğeyi döndüren bir yönteme sahiptir.

next()Yöntem iki özellikleri içerir: valueve done.

  • değeri özelliği herhangi bir veri türü olabilir ve sırayla mevcut değeri temsil eder olabilir.
    value
  • yapılan özelliği yineleme tam olup olmadığını gösteren bir mantıksal değerdir. Yineleme eksikse, özellik olarak ayarlanır , aksi takdirde olarak ayarlanır .
    donedonefalsetrue

Dizi yinelemelerinin bir örneğine bakalım:

 const arr = ('h', 'e', 'l', 'l', 'o'); let arrIterator = arr(Symbol.iterator)(); console.log(arrIterator.next()); // (value: "h", done: false) console.log(arrIterator.next()); // (value: "e", done: false) console.log(arrIterator.next()); // (value: "l", done: false) console.log(arrIterator.next()); // (value: "l", done: false) console.log(arrIterator.next()); // (value: "o", done: false) console.log(arrIterator.next()); // (value: undefined, done: true)

next()Bir arrIteratornesnenin üzerinde yinelemek için tekrar tekrar çağırabilirsiniz .

  • next()Yöntem iki özelliğe sahip bir nesne döndürür: valueve done.
  • Tüm next()yöntem dizisinin sonuna ulaştığında, daha sonra doneözelliği ayarlanır false.

for… ofDöngünün yukarıdaki programı nasıl çalıştırdığına bakalım . Örneğin,

 const arr = ('h', 'e', 'l', 'l', 'o'); for (let i of arr) ( console.log(i); )

Çıktı

 Merhaba

for… ofDöngü tam yukarıdaki program aynı yapar.

for… ofDöngü arayıp duruyor next()yineleyici üzerinde yöntemini. O ulaştığında done:true, for… ofdöngü sona erer.

Kullanıcı Tanımlı Yineleyici

Ayrıca kendi yineleyicinizi oluşturabilir next()ve bir sonraki öğeye erişmek için arama yapabilirsiniz . Örneğin,

 function displayElements(arr) ( // to update the iteration let n = 0; return ( // implementing the next() function next() ( if(n < arr.length) ( return ( value: arr(n++), done: false ) ) return ( value: undefined, done: true ) ) ) ) const arr = ('h', 'e', 'l', 'l', 'o'); const arrIterator = displayElements(arr); console.log(arrIterator.next()); console.log(arrIterator.next()); console.log(arrIterator.next()); console.log(arrIterator.next()); console.log(arrIterator.next()); console.log(arrIterator.next());

Çıktı

 (değer: "h", tamamlandı: yanlış) (değer: "e", tamamlandı: yanlış) (değer: "l", bitti: yanlış) (değer: "l", bitti: yanlış) (değer: "o" , bitti: yanlış) (değer: tanımsız, bitti: doğru)

Yukarıdaki programda kendi yineleyicimizi yarattık. displayElements()İşlevini verir valueve doneözellik.

  • Her next()yöntemi olarak adlandırılır, fonksiyon bir dizi değeri bir kez ve görüntüler çalıştırılmaktadır.
  • Son olarak, bir dizinin tüm öğeleri tükendiğinde, doneözellik as trueile valueolarak ayarlanır undefined.

Ilginç makaleler...