Map කොලෙක්ෂන් භාවිතය

අපට පේරා ඇත:

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

එක් එක් පේරා මත ක්ලික් කිරීමෙන් පේරා ලැයිස්තුවේ එහි අනුක්රමික අංකය එහි අවසානයට ලියා ඇති ආකාරයට අපි කරමු. Map හරහා කාර්යය විසඳමු.

අපි පටන් ගනිමු. පළමුව අපගේ පේරා විචල්යයකට ලබා ගනිමු:

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

නව Map කොලෙක්ෂනයක් සාදමු:

let map = new Map;

පේරා යතුරු වන අතර ඒවායේ අගයන් අනුක්රමික අංක වන පරිදි අපගේ කොලෙක්ෂනය පුරවමු:

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

පේරා ලූපයකින් පුරා ගොස් ඒවායේ ක්ලික් කිරීමේ හැසිරවීම්කරුවෙකු අලවන්න:

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

දැන් අපි ක්ලික් කිරීමෙන් අනුක්රමික අංකය පේරා ගෙ පෙළ අවසානයට එකතු කරමු. මෙම අංකය අපගේ කොලෙක්ෂනයෙන් ලබා ගනිමු:

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

ඉන්පුට් ලබා දී ඇත. මෙම ඉන්පුට් ලූපයකින් පුරා ගොස් Map කොලෙක්ෂනයක් සාදන්න, එහි යතුරු ඉන්පුට් වන අතර අගය එහි පිටුවේ අනුක්රමික අංකය වේ. ඕනෑම ඉන්පුට් එකක් මත ක්ලික් කිරීමෙන් එහි value තුළ එහි අනුක්රමික අංකය ලියා ඇති ආකාරයට කරන්න.

ඉන්පුට් ලබා දී ඇත. එක් එක් ඉන්පුට් එකකට අංකයක් ඇතුළු කළ හැක. Enter එබීමෙන් ඉන්පුට් එක ඇතුළු කළ අංකය මතක තබා ගනී. ඉන්පුට් එක අවධානය අහිමි වූ විට කොන්සෝලයේ මීට පෙර ඉන්පුට් එකට ඇතුළු කළ සියලුම අංකවල අරාව මුද්‍රණය වන පරිදි කරන්න.