Map Koleksiyonlarının Uygulanması

Diyelim ki paragraflarımız var:

<p>aaa</p>
<p>bbb</p>
<p>ccc</p>
<p>ddd</p>
<p>eee</p>

Her paragrafa tıklandığında, listenin sonuna sıra numarasının yazılmasını sağlayalım. Görevi Map ile çözelim.

Hadi başlayalım. Öncelikle paragraflarımızı bir değişkene alalım:

let elems = document.querySelectorAll('p');

Yeni bir Map koleksiyonu oluşturalım:

let map = new Map;

Koleksiyonumuzu, anahtarların paragraflarımız, değerlerin ise sıra numaraları olacak şekilde dolduralım:

let i = 1;
for (let elem of elems) {
	map.set(elem, i++);
}

Paragrafları döngü ile geçelim ve üzerlerine tıklama işleyicisi ekleyelim:

for (let elem of elems) {
	elem.addEventListener('click', function() {
		
	});
}

Şimdi tıklama sonucunda sıra numarasını paragraf metninin sonuna ekleyelim. Bu numarayı koleksiyonumuzdan alalım:

for (let elem of elems) {
	elem.addEventListener('click', function() {
		this.textContent += map.get(this);
	});
}

Giriş alanları verilsin. Bu giriş alanlarını bir döngü ile geçin ve anahtarların giriş alanları, değerin ise sayfadaki sıra numaraları olduğu bir Map koleksiyonu oluşturun. Herhangi bir giriş alanına tıklandığında, value değerine sıra numarasının yazılmasını sağlayın.

Giriş alanları verilsin. Her giriş alanına bir sayı girilebilir. Enter tuşuna basıldığında, giriş alanının girilen sayıyı hatırlamasını sağlayın. Odak kaybı olduğunda, konsola o giriş alanına daha önce girilen tüm sayıların dizisinin yazdırılmasını sağlayın.