Matumizi ya Map ya Mkusanyiko

Wacha tuwe na aya:

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

Wacha tufanye ili kwa kubofya kila aya nambari yake ya mlolongo iandikwe mwishoni mwake kwenye orodha ya aya. Tatua tatizo kwa kutumia Map.

Tuanze. Kwanza tupate aya zetu kwenye kutofautisha:

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

Tuunde mkutano mpya Map:

javascriptlet map = new Map;

Wacha tujaze mkutano wetu ili funguo ziwe aya zetu, na maadili yake ziwe nambari za mlolongo:

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

Wacha tuzungushe aya kwa mzunguko na kuweka kichungi cha kubofya:

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

Wacha sasa kwa kubofya tuongeze nambari ya mlolongo mwishoni mwa maandishi ya aya. Wakati huo huo tutapata nambari hii kutoka kwa mkutano wetu:

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