JavaScript හි this වස්තුව

දැන් අපි වැඩ කරන්නේ සිදුවීම් හසුරුවන ශ්‍රිතය තුළට ප්‍රවේශ විය හැකි විශේෂ වස්තුව this සමඟය. මෙම වස්තුව සිදුවීම සිදුවූ අංගය දක්වයි.

සිදුවීම සිදුවූ අංගය සහ සිදුවීමක ප්‍රතිඵලයක් ලෙස ක්‍රියා සිදු කරන අංගය එකම අංගය වන විට this වස්තුව පහසුය.

උදාහරණයක් ලෙස, අපට ආදාන ක්ෂේත්‍රයක් තිබේ නම්, අපට එයට නාභිගත කිරීම අහිමි වීමේ සිදුවීම හසුරුවන එකක් බැඳිය හැකි අතර මෙම සිදුවීම සිදුවීමත් සමඟ ආදාන ක්ෂේත්‍රයේ පෙළ සමඟ යමක් කරන්න. අපි විස්තර කළ දේ කරමු. අපට ආදාන ක්ෂේත්‍රයක් ලබා දී ඇතැයි සිතමු:

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

අපි එය විචල්‍යයකට elem සබැඳිය ලබා ගනිමු:

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

අපි එයට blur සිදුවීමේ ශ්‍රිතය-හසුරුවන එකක් බැඳිය යුතුය:

elem.addEventListener('blur', func);

මෙම func ශ්‍රිතය තුළ අපගේ ආදාන ක්ෂේත්‍රය දක්වන this වස්තුවට ප්‍රවේශ විය හැකිය:

function func() {
	console.log(this); // අපගේ අංගයට සබැඳිය අඩංගු වේ
}

අපගේ ආදාන ක්ෂේත්‍රයේ value ගුණාංගයේ අන්තර්ගතය මුද්‍රණය කරමු:

function func() {
	console.log(this.value); // ගුණාංගයේ අන්තර්ගතය මුද්‍රණය කරමු
}

දැන්, අපි ආදාන ක්ෂේත්‍රයට යම් පෙළක් ලියමු:

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

නිර්නාමික ශ්‍රිතයක් ද භාවිතා කළ හැකිය:

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

ආදාන ක්ෂේත්‍රයක් ලබා දී ඇත. මෙම ආදාන ක්ෂේත්‍රය නාභිගත වීමත් සමඟ එහි 1 අංකය ලියන්න, නාභිගත කිරීම අහිමි වීමත් සමඟ - 2 අංකය. ශ්‍රිතය-හසුරුවන එක තුළ ආදාන ක්ෂේත්‍රය වෙත යොමු වීම සඳහා this වස්තුව භාවිතා කරන්න.

බොත්තමක් ලබා දී ඇත, එහි අගය ලෙස 1 අංකය පවතී. මෙම බොත්තම මත ක්ලික් කිරීමෙන් එහි අගය සෑම අවස්ථාවකම එකකින් වැඩි වන පරිදි සකසන්න.