Şub.17

Hızlandırılmış EcmaScript 6+ Dersleri – 4: for of Döngüsü (String, Array, Map, Set)


EcmaScript 6 ile gelmiş olan bu döngü gerçekten oldukça işimizi kolaylaştıran bir iteratif işlemler dizisi uygular. Mesela bir String’in tüm karakterlerini, bir Array’in tüm elemanlarını, bir Map’in tüm elemanlarını veya bir Set’in tüm benzersiz elemanlarını sırası ile işleyebilir. Her biri için örnek yapalım.

String

Örneğimizde bir metnin tüm elemanlarını for of döngüsü ile dönelim.

let text = 'HTML 5';
for (let i of text) {
  console.log(i);
}

Bu döngü aşağıdaki gibi çıktı verecektir.

“H”
“T”
“M”
“L”
“ “
“5”

Görüldüğü gibi her bir harf bir string olarak yazdırıldı.

Array

let sayilar = [1, 2];
for (let i of sayilar) {
  console.log(i);
}

Çıktısı aşağıdaki gibidir.

1
2

Map

Map, aynı Object gibi key-value şeklinde değerleri saklar ve key’ler ile değerlere ulaşılabilir. Map’ten değerler çekilirken .get(keyIsmi) şeklinde kullanılır.

let map = new Map();
map.set('1', 'Bir'); // string key
map.set(2, 'İki');  // nümerik key
console.log( map.get(2) ); // 'İki'
console.log( map.get('1') ); // 'Bir'
console.log( map.size ); // 2
for (let i of map) {
  console.log(i);
}

map isminde bir Map oluşturduk. Sırası ile “1” string key ile “Bir” değerini ekledik. Sonra 2 nümerik key ile “İki” değerini ekledik. Konsollarda ise .get() metodunu kullanarak parametre değeri de key isimlerini girdik ve böylece value’ları yazdırıldı.

.size() metodu ile de Map’in kaç elemanı olduğuna baktık. Yine for of döngümüzde de key-value şeklinde Array olarak her bir Obje elemanını yazdırdık.

Çıktısı aşağıdaki gibidir.

"İki"
"Bir"
2
["1", "Bir"]
[2, "İki"]

Set

Set, aynı Array gibi görünür. Ancak kendi içinde bir birinin eşi olan, yani birbirinin aynısı olan değerleri görmezden gelir, sadece birini alır. Yani Set içinde döndürülen değerler tekil (uniqe)’dir.

let set = new Set([1, 1, 2, 2, 3, 3, "3", 5]);
for (let i of set) {
  console.log(i);
}

set isminde bir Set tanımladık. Sırası ile iki tane nümerik (yani Integer) 1, iki tane nümerik 2, iki tane nümerik 3, bir tane metin (yani String) olarak 3 ve son olarak da bir tane nümerik 5 ekledik. Bunları tekil olarak for of döngüsü ile döndüğümüzde sonuç aşağıdaki gibi olur.

1
2
3
"3"
5

3 ve “3” değerlerinin aynı şeyler olmadığına dikkat edin. Birisi sayı, diğeri metindir.

Makale serimizin diğer konuları şunlar olacaktır:


Web Tasarımı ve Web Programlama 2020

Yorum bırak

Yorum