जावास्क्रिप्ट में bind मेथड के माध्यम से कॉन्टेक्स्ट बाइंडिंग

अगली मेथड bind कॉन्टेक्स्ट को फंक्शन से स्थायी रूप से बांधने की अनुमति देती है। यह मेथड अपने परिणाम के रूप में एक नया फंक्शन रिटर्न करती है, जिसके अंदर this का मान सख्ती से निर्धारित होगा।

आइए एक उदाहरण पर नजर डालते हैं।

मान लीजिए कि हमारे पास एक इनपुट है:

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

मान लीजिए कि इस इनपुट का लिंक वेरिएबल elem में सेव है:

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

मान लीजिए कि हमारे पास निम्नलिखित फंक्शन func भी है:

function func(param1, param2) {
	console.log(this.value + param1 + param2);
}

आइए bind की मदद से एक नया फंक्शन बनाते हैं, जो func फंक्शन की कॉपी होगी, लेकिन this इसमें हमेशा elem के बराबर होगा:

let newFunc = func.bind(elem);

अब वेरिएबल newFunc में एक फंक्शन है। आइए इसे कॉल करते हैं, पहले पैरामीटर में '1' पास करके, और दूसरे में '2' (याद दिलाता हूं कि elem में value वाला इनपुट है, जो 'text' के बराबर है):

newFunc('1', '2');

आइए सब कुछ एक साथ इकट्ठा करते हैं:

let elem = document.getElementById('elem');

function func(param1, param2) {
	console.log(this.value + param1 + param2);
}

let newFunc = func.bind(elem);
newFunc('1', '2'); // 'text12' आउटपुट करेगा

bind के रिजल्ट को नए फंक्शन newFunc में सेव करना जरूरी नहीं है, बस func को ओवरराइट कर सकते हैं। इसके बाद func वैसा ही फंक्शन होगा, जैसा पहले था, लेकिन this सख्ती से बाउंड होगा:

func = func.bind(elem);

मान लीजिए निम्नलिखित कोड दिया गया है:

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

let elem = document.getElementById('elem');

function func(name, surname) {
	console.log(this.value + ', ' + name + ' ' + surname);
}

// यहां bind() के साथ कंस्ट्रक्शन लिखें

func('John', 'Smit'); // यहां 'hello, John Smit' आउटपुट करना चाहिए
func('Eric', 'Luis'); // यहां 'hello, Eric Luis' आउटपुट करना चाहिए

निर्दिष्ट स्थान पर bind मेथड के साथ कंस्ट्रक्शन लिखें ताकि func फंक्शन के अंदर this हमेशा elem वेरिएबल के इनपुट की ओर इशारा करे।