DOM နှင့် အလုပ်လုပ်ရန် JavaScript တွင် Callback လွှဲပြောင်းခြင်း

ကျွန်ုပ်တို့တွင် DOM element အစုတစ်ခုရှိသည်ဆိုပါစို့။

<p class="elem">1</p>
<p class="elem">2</p>
<p class="elem">3</p>
<p class="elem">4</p>
<p class="elem">5</p>

ကျွန်ုပ်တို့ forEach function တစ်ခုကို ဖန်တီးကြပါစို့။ ၎င်းသည် ပထမ parameter အဖြစ် element အစုတစ်ခု၏ selector ကို လက်ခံမည်၊ ဒုတိယ parameter အဖြစ် callback function တစ်ခုကို လက်ခံမည်။ ထို callback function ကို ရှာတွေ့သော element တစ်ခုစီအား အလှည့်ကျ သက်ရောက်စေမည်။

forEach('.elem', function() {
	// function သည် element တစ်ခုစီအား သက်ရောက်မည်
});

Selector အောက်သို့ ရောက်ရှိသော element များသည် callback ၏ ပထမ parameter ထဲသို့ အလှည့်ကျ ရောက်ရှိပါစေဟု ယူဆကြပါစို့။

forEach('.elem', function(elem) {
	console.log(elem); // ရှာတွေ့သော element များကို အလှည့်ကျ ထုတ်ပြမည်
});

ယခု ကျွန်ုပ်တို့၏ function ကို အသုံးပြု၍ elem class ရှိသော element အားလုံးကို ရှာပြီး၊ ရှာတွေ့သော element တစ်ခုစီအတွက် သက်ရောက်မည့် callback တစ်ခုကို ဖန်တီးကြပါစို့။ ထို callback သည် element တစ်ခုစီ၏ စာသားကို နှစ်ထပ်ကိန်းတင်ပေးမည်။

forEach('.elem', function(elem) {
	elem.textContent = elem.textContent ** 2;
});

ယခု ကျွန်ုပ်တို့ စိတ်ကူးထားသည့် forEach function ၏ အသွင်အပြင်ကို ရေးသားကြပါစို့။

function forEach(selector, func) {
	let elems = document.querySelectorAll(selector);
	
	for (let elem of elems) {
		func(elem);
	}
}

�ာပိုဒ်များကို ပေးထားပါသည်။ ကျွန်ုပ်တို့ ဖန်တီးထားသော forEach function ကို အသုံးပြု၍ စာပိုဒ်တစ်ခုစီ၏ စာသားအဆုံးတွင် အာမေဋိတ်အမှတ်အသား (!) ကို ထည့်ပေးပါ။