यह एक फंक्शन एक्सप्रेशन है, यह तुरंत इन्वॉल्व्ड फंक्शन एक्सप्रेशन (IIFE) के लिए है। IIFE बस एक ऐसा फंक्शन है जिसे बनाने के ठीक बाद निष्पादित किया जाता है। तो जब तक इसे निष्पादित करने के लिए नहीं कहा जाता है, तब तक प्रतीक्षा करने के लिए समारोह के आईआईएफई को तुरंत निष्पादित किया जाता है। आइए उदाहरण के लिए IIFE का निर्माण करें। मान लें कि हमारे पास एक ऐड फंक्शन है जो दो पूर्णांक को आर्ग के रूप में लेता है और योग देता है जो ऐड फ़ंक्शन को IIFE में बनाता है,
चरण 1: फ़ंक्शन को परिभाषित करें
function add (a, b){
return a+b;
}
add(5,5);
Step2: पूरे फंक्शनल डिक्लेरेशन को कोष्ठकों में लपेटकर फ़ंक्शन को कॉल करें
(function add (a, b){
return a+b;
})
//add(5,5);
चरण 3: फ़ंक्शन को लागू करने के लिए तुरंत कॉल से 'जोड़ें' पाठ को हटा दें।
(function add (a, b){
return a+b;
})(5,5);
IFFE का उपयोग करने का मुख्य कारण आपके फ़ंक्शन के भीतर एक निजी गुंजाइश को संरक्षित करना है। अपने जावास्क्रिप्ट कोड के अंदर आप यह सुनिश्चित करना चाहते हैं कि, आप किसी भी वैश्विक चर को ओवरराइड नहीं कर रहे हैं। कभी-कभी आप आकस्मिक रूप से एक वैरिएबल को परिभाषित कर सकते हैं जो वैश्विक वैरिएबल को ओवरराइड करता है। आइए उदाहरण के द्वारा प्रयास करें। मान लें कि हमारे पास iffe.html नामक एक html फ़ाइल है और बॉडी टैग के अंदर कोड हैं-
<body>
<div id = 'demo'></div>
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
</body>
ठीक है, उपरोक्त कोड किसी भी प्रश्न के साथ निष्पादित करेगा, अब मान लें कि आप एक चर नाम का दस्तावेज आकस्मिक या जानबूझकर घोषित करते हैं।
<body>
<div id = 'demo'></div>
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
const document = "hi there";
console.log(document);
</script>
</body>
आप एक SyntaxError में एंडअप करेंगे : गैर-विन्यास योग्य वैश्विक संपत्ति दस्तावेज़ का पुनर्वितरण।
लेकिन अगर आपकी इच्छा एक चर नाम documet घोषित करने की है, तो आप इसे IFFE का उपयोग करके कर सकते हैं।
<body>
<div id = 'demo'></div>
<script>
(function(){
const document = "hi there";
this.document.getElementById("demo").innerHTML = "Hello JavaScript!";
console.log(document);
})();
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
</body>
आउटपुट:
आइए एक और उदाहरण द्वारा कोशिश करते हैं, मान लें कि हमारे पास कैलकुलेटर जैसी कोई वस्तु है-
<body>
<script>
var calculator = {
add:function(a,b){
return a+b;
},
mul:function(a,b){
return a*b;
}
}
console.log(calculator.add(5,10));
</script>
</body>
वैसे यह एक आकर्षण की तरह काम कर रहा है, क्या होगा अगर हम गलती से कैलकुलेटर ऑब्जेक्ट के मूल्य को फिर से असाइन करें।
<body>
<script>
var calculator = {
add:function(a,b){
return a+b;
},
mul:function(a,b){
return a*b;
}
}
console.log(calculator.add(5,10));
calculator = "scientific calculator";
console.log(calculator.mul(5,5));
</script>
</body>
हाँ, आप एक TypeError के साथ एंडअप करेंगे: कैलकुलेटर ।.m एक फ़ंक्शन iffe.html नहीं है
लेकिन IFFE की मदद से हम एक निजी दायरा बना सकते हैं जहाँ हम एक और परिवर्तनशील नाम कैलकुलेटर बना सकते हैं और उसका उपयोग कर सकते हैं;
<body>
<script>
var calculator = {
add:function(a,b){
return a+b;
},
mul:function(a,b){
return a*b;
}
}
var cal = (function(){
var calculator = {
sub:function(a,b){
return a-b;
},
div:function(a,b){
return a/b;
}
}
console.log(this.calculator.mul(5,10));
console.log(calculator.sub(10,5));
return calculator;
})();
console.log(calculator.add(5,10));
console.log(cal.div(10,5));
</script>
</body>
आउटपुट:
