জাভাস্ক্রিপ্টে call মেথডের মাধ্যমে কনটেক্সট বাইন্ডিং

সুতরাং, আমরা বুঝে নিয়েছি যে কিভাবে this আসলে কাজ করে। এখন আসুন সেই মেথডগুলি দেখি, যেগুলো জোরপূর্বক নির্দিষ্ট করতে দেয়, কোন কনটেক্সটে একটি ফাংশন কল করা হচ্ছে (অর্থাৎ জোর করে বলতে দেয়, this এর মান কী)।

আমরা যে প্রথম মেথডটি দেখব, তার নাম call। আসুন একটি উদাহরণের মাধ্যমে এর কাজ দেখি। আমাদের কাছে একটি ইনপুট আছে ধরা যাক:

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

আসুন এই ইনপুটটির রেফারেন্স নিই এবং এটিকে elem ভেরিয়েবলে রাখি:

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

এখন আসুন একটি ফাংশন func বানাই, যার ভিতরে this.value আউটপুট করব:

javascriptfunction func() {
  console.log(this.value);
}

আমাদের ফাংশনটি এখনও জানে না যে, this কীকে নির্দেশ করছে। যদি আমরা এটিকে addEventListener এর মাধ্যমে বাইন্ড করতাম, তাহলে হ্যাঁ। কিন্তু আমরা তা করব না। পরিবর্তে আমরা শুধু আমাদের ফাংশনটি কল করব, এটিকে বলে দেব যে this এর মান elem এর সমান হতে হবে।

এটি এভাবে করা হয়: func.call(elem)। এই কোডটি সরল ফাংশন কল func এভাবে: func() এর সমতুল্য, শুধুমাত্র এই শর্তে যে this এর মান elem।

সুতরাং, call মেথডের সিনট্যাক্স হল: ফাংশন.call(অবজেক্ট)। আসুন সবকিছু একত্রিত করি:

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

function func() {
  console.log(this.value); // ইনপুটের value আউটপুট করবে
}
func.call(elem);

javascriptfunction func() {
  console.log(this.value);
}

html<input id="elem1" value="text1">
<input id="elem2" value="text2">
<input id="elem3" value="text3">