Penerapan Koleksi Map

Misalkan kita memiliki paragraf-paragraf:

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

Mari kita buat agar saat diklik, setiap paragraf akan menambahkan nomor urutnya dalam daftar paragraf di akhir teksnya. Mari selesaikan masalah ini menggunakan Map.

Mari kita mulai. Pertama-tama, ambil paragraf-paragraf kita ke dalam variabel:

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

Buat koleksi Map baru:

let map = new Map;

Isi koleksi kita sehingga kuncinya adalah paragraf-paragraf kita, dan nilainya adalah nomor urut:

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

Ulangi paragraf dengan loop dan pasang penangan klik pada mereka:

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

Sekarang, saat diklik, mari tambahkan nomor urut ke akhir teks paragraf. Pada saat yang sama, kita akan mendapatkan nomor ini dari koleksi kita:

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

Diberikan input-input. Ulangi input-input ini dengan loop dan buat koleksi Map, di mana kuncinya adalah input-input, dan nilainya adalah nomor urutnya pada halaman. Buat agar saat diklik pada input mana pun, value-nya diisi dengan nomor urutnya.

Diberikan input-input. Ke setiap input dapat dimasukkan angka. Misalkan saat menekan Enter, input menyimpan angka yang dimasukkan. Buat agar saat kehilangan fokus, input tersebut akan mencetak ke konsol array semua angka yang sebelumnya dimasukkan ke dalam input tersebut.