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

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

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

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

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

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

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

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

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

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

javascriptlet newFunc = func.bind(elem);

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

javascriptnewFunc('1', '2');

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

javascriptlet 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 सख्ती से बाउंड होगा:

javascriptfunc = func.bind(elem);

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

javascriptlet 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' आउटपुट करना चाहिए