JavaScript ရှိ this object

ယခု ကျွန်ုပ်တို့သည် အထူး object this နှင့် အလုပ်လုပ်မည်၊ ၎င်းသည် ဖြစ်ရပ်လက်ခံဖြေရှင်းသည့် function အတွင်း ရရှိနိုင်ပြီး၊ ဒီ object သည် ဖြစ်ရပ် ဖြစ်ပွားသည့် element ကို ညွှန်ပြသည်။

this object သည် အသုံးဝင်သည်မှာ ဖြစ်ရပ်ဖြစ်ပွားသည့် element နှင့် ဖြစ်ရပ်၏ရလဒ်အဖြစ် လုပ်ဆောင်ချက်များ ပြုလုပ်သည့် element တို့သည် တူညီသော element တစ်ခုတည်းဖြစ်သည့်အခါ ဖြစ်သည်။

ဥပမာအားဖြင့်၊ input တစ်ခုရှိလျှင်၊ ၎င်းအား focus ပျောက်သွားခြင်း ဖြစ်ရပ်အတွက် လက်ခံဖြေရှင်းသူကို ချိတ်ဆက်ပေးပြီး ထိုဖြစ်ရပ် ဆိုက်ရောက်သည့်အခါ input ၏ text နှင့် တစ်ခုခုပြုလုပ်နိုင်သည်။ ဖော်ပြပါအတိုင်း လုပ်ဆောင်ကြည့်ကြမည်။ input ပေးထားသည်ဟု ဆိုကြပါစို့။

<input id="elem" value="text">

၎င်းအား variable elem အတွင်း reference ရယူကြမည်။

let elem = document.querySelector('#elem');

၎င်းအား blur ဖြစ်ရပ်၏ function လက်ခံဖြေရှင်းသူနှင့် ချိတ်ဆက်ပေးမည်။

elem.addEventListener('blur', func);

ဤ function func အတွင်းတွင် ကျွန်ုပ်တို့၏ input ကို ညွှန်ပြသည့် this object ကို ရရှိနိုင်သည်။

function func() {
	console.log(this); // ကျွန်ုပ်တို့၏ element သို့ reference ပါဝင်သည်
}

ကျွန်ုပ်တို့၏ input ၏ value attribute အတွင်းရှိအရာကို ထုတ်ပြကြမည်။

function func() {
	console.log(this.value); // attribute အတွင်းရှိအရာကို ထုတ်ပြမည်
}

ယခု input အတွင်း စာသားတစ်ခုခု ရေးထည့်ကြမည်။

function func() {
	this.value = '!!!';
}

နာမည်မဲ့ function ကိုလည်း အသုံးပြုနိုင်သည်။

elem.addEventListener('blur', function() {
	this.value = '!!!';
});

input ပေးထားသည်။ ဤ input သည် focus ရရှိသည့်အခါ ၎င်းအတွင်း 1 ကိန်းကို ရေးထည့်ပြီး၊ focus ပျောက်သွားသည့်အခါ - 2 ကိန်းကို ရေးထည့်ပါ။ function လက်ခံဖြေရှင်းသူအတွင်း input သို့ ရည်ညွှန်းရာတွင် this object ကို အသုံးပြုပါ။

ခလုတ်တစ်ခုပေးထားပြီး၊ ၎င်း၏တန်ဖိုးသည် ကိန်း 1 ဖြစ်သည်။ ဤခလုတ်ကို နှိပ်သည့်အခါတိုင်း ၎င်း၏တန်ဖိုး တစ်ကြိမ်စီ တိုးလာစေရန် လုပ်ဆောင်ပါ။