1351

Sıfırdan İleri Seviye Modern Javascript Dersleri ES7+

Js For/Of Döngüsü

Javascript dersleri serimizin bu bölümünde ES6 ile birlikte gelen javascript döngü tiplerinden for-of döngüsünü öğrenelim.



Javascript For/Of Döngüsü

Javascript for/of döngüsü ile iterable bir nesnenin tüm elemanlarına ulaşabiliriz.

Iterable nesneler yapı itibariyle elemanları üzerinde döngüler ile gezilebilir nesnelerdir. Örneğin array, set, map, string gibi javascript nesneleri iterable nesnelerdir.

Kullanım şekli;

for (element of iterable) {
    // kod bloğu
}

iterable nesnenin her biri sırasıyla element değişkeni içerisine kopyalanır.

iterable array, set, map, string olabilir.

element const, let ve var ile tanımlanabilir.

For/Of Döngüsünün Dizi ile Kullanımı

For/Of döngüsü ile diziler üzerindeki tüm elemanlara kolaylıkla ulaşabiliriz.

Örnek:

// array
const ogrenciler = ['Ali', 'Ahmet', 'Yasemin'];

for ( let ogrenci of ogrenciler ) {
    console.log(ogrenci);
}

// Ali
// Ahmet
// Yasemin

iterable bir nesne olan ogrenciler dizisi üzerindeki tüm elemanlar sırasıyla ogrenci değişkeni içerisine kopyalanır ve ekrana yazdırılır.

For/Of Döngüsünün String ile Kullanımı

For/Of döngüsü ile string bir verideki tüm karakterlere kolaylıkla ulaşabiliriz.

Örnek:

// string
const string = 'hey';

for (let i of string) {
    console.log(i);
}

// h
// e
// y

iterable bir nesne olan string verideki tüm karakterlere sırasıyla ulaşıp ekrana yazdırıyoruz.

For/Of Döngüsünün Set ile Kullanımı

For/Of döngüsü ile javascript set nesnesi üzerindeki tüm elemanlara ulaşabiliriz.

** set nesnesinde elemanlar tekrarlanmadan saklanır. Örneğin; iki tane 5 sayısı yerine tek 5 sayısı saklanır.

Örnek:

const set = new Set([1, 2, 3]);

for (let i of set) {
    console.log(i);
}

// 1
// 2
// 3

For/Of Döngüsünün Map ile Kullanımı

For/Of döngüsü ile javascript map nesnesi üzerindeki tüm elemanlara ulaşabiliriz.

** map nesnesinde elemanlar key-value şeklinde saklanır. Örneğin; plaka ve şehir bilgisi.

// boş bir map tanımlaması
let map = new Map();

// map nesnesine eleman ekleme
map.set('sehir', 'Kocaeli');
map.set('plaka', '41');

for (let [key, value] of map) {
    console.log(key + '- ' + value);
}

// sehir- kocaeli
// plaka- 41