Vivasoft-logo

2.12 IIFE

IIFE āϜāĻžāĻ­āĻžāĻ¸ā§āĻ•ā§āϰāĻŋāĻĒā§āĻŸā§‡āϰ āĻ…āĻ¨ā§āϝāϤāĻŽ āϜāύāĻĒā§āϰāĻŋāϝāĻŧ āĻāĻ•āϟāĻŋ āĻĄāĻŋāϜāĻžāχāύ āĻĒā§āϝāĻžāϟāĻžāĻ°ā§āύāĨ¤ āĻāϟāĻŋ āχāĻĢāĻŋ āĻŦāϞ⧇āχ āωāĻšā§āϚāĻžāϰāĻŖ āĻ•āϰ⧇āĨ¤ IIFE āϜāĻžāĻ­āĻžāĻ¸ā§āĻ•ā§āϰāĻŋāĻĒā§āϟ āĻ•āĻŽāĻŋāωāύāĻŋāϟāĻŋ āĻĻā§€āĻ°ā§āϘāĻĻāĻŋāύ āϧāϰ⧇ āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰ⧇ āφāϏāϛ⧇ āĻ•āĻŋāĻ¨ā§āϤ⧁ āĻāϰ āĻŽāĻŋāϏāϞāĻŋāĻĄāĻŋāĻ‚ āĻļāĻŦā§āĻĻāϟāĻŋ āĻ›āĻŋāϞ “āϏ⧇āϞāĻĢ-āĻāĻ•ā§āϏāĻŋāĻ•āĻŋāωāϟāĻŋāĻ‚ āĻāύ⧋āύāĻŋāĻŽāĻžāϏ āĻĢāĻžāĻ‚āĻļāĻ¨â€ āϝāĻž āĻĒāϰāĻŦāĻ°ā§āϤ⧀āĻ¤ā§‡Â Ben Alman āĻāϟāĻŋāϰ āĻāĻ•āϟāĻŋ āωāĻĒāϝ⧁āĻ•ā§āϤ āύāĻžāĻŽ āĻĻāĻŋāϝāĻŧ⧇āϛ⧇āύ “IIFE”āĨ¤ āφāϜāϕ⧇ āĻāϟāĻžāϰ āϏāĻŽā§āĻĒāĻ°ā§āϕ⧇ āĻŦāĻŋāĻ¸ā§āϤāĻžāϰāĻŋāϤ āϞ⧇āĻ–āĻžāϰ āĻšā§‡āĻˇā§āϟāĻž āĻ•āϰāĻŦā§‹āĨ¤

IIFE āĻ•āĻŋ?

IIFE – āĻāϰ āĻĒā§‚āĻ°ā§āĻŖāϰ⧁āĻĒ āĻšāĻšā§āϛ⧇ Immediately Invoked Function ExpressionāĨ¤ IIFE āĻšāϞ āĻāĻ•āϟāĻŋ āĻĢāĻžāĻ‚āĻļāύ āϝāĻž āĻāĻ•āϟāĻŋ āĻāĻ•ā§āϏāĻĒā§āϰ⧇āĻļāύ āĻšāĻŋāϏāĻžāĻŦ⧇ āĻĄāĻŋāĻ•ā§āĻ˛ā§‡ā§ŸāĻžāϰ āĻāĻŦāĻ‚ āĻĄāĻŋāĻ•ā§āĻ˛ā§‡ā§ŸāĻžāϰ⧇āĻļāύ⧇āϰ āĻĒāϰāĻĒāϰāχ āĻāĻ•ā§āϏāĻŋāĻ•āĻŋāωāϟ āĻ•āϰāĻž āĻšāϝāĻŧāĨ¤

IIFE āϏāĻŋāύāĻŸā§āϝāĻžāĻ•ā§āϏāσ

āύāĻŋāĻŽā§āύāϞāĻŋāĻ–āĻŋāϤ āϏāĻŋāύāĻŸā§āϝāĻžāĻ•ā§āϏ āĻĻ⧇āĻ–āĻžāϝāĻŧ āĻ•āĻŋāĻ­āĻžāĻŦ⧇ IIFE āĻĄāĻŋāĻĢāĻžāχāύ āĻ•āϰāϤ⧇ āĻšā§Ÿāσ

				
					(function () {
	// code goes here...
})();

				
			

āφāĻĒāύāĻŋ arrow function āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰ⧇āĻ“ IIFE āĻĄāĻŋāĻĢāĻžāχāύ āĻ•āϰāϤ⧇ āĻĒāĻžāϰāĻŦ⧇āύāĨ¤

				
					(() => {
	// code goes here...
})();

				
			

IIFE āϕ⧇āύ?

āϝāĻ–āύ āφāĻĒāύāĻŋ āĻāĻ•āϟāĻŋ āĻĢāĻžāĻ‚āĻļāύ āĻĄāĻŋāĻĢāĻžāχāύ āĻŦāĻž āĻĄāĻŋāĻ•ā§āĻ˛ā§‡ā§ŸāĻžāϰ āĻ•āϰ⧇āύ, āϜāĻžāĻ­āĻžāĻ¸ā§āĻ•ā§āϰāĻŋāĻĒā§āϟ āχāĻžā§āϜāĻŋāύ āĻ—ā§āϞ⧋āĻŦāĻžāϞ āĻ…āĻŦāĻœā§‡āĻ•ā§āĻŸā§‡āϰ āϏāĻžāĻĨ⧇ āĻĢāĻžāĻ‚āĻļāύāϕ⧇ āϝ⧋āĻ— āĻ•āϰ⧇āĨ¤ āĻāĻ•āχāĻ­āĻžāĻŦ⧇, āϝāĻĻāĻŋ āφāĻĒāύāĻŋ āĻĢāĻžāĻ‚āĻļāύ⧇āϰ āĻŦāĻžāχāϰ⧇ āĻāĻ•āϟāĻŋ āϭ⧇āϰāĻŋāϝāĻŧ⧇āĻŦāϞ āĻĄāĻŋāĻ•ā§āĻ˛ā§‡ā§ŸāĻžāϰ āĻ•āϰ⧇āύ, āϜāĻžāĻ­āĻžāĻ¸ā§āĻ•ā§āϰāĻŋāĻĒā§āϟ āχāĻžā§āϜāĻŋāύ āϐ āϭ⧇āϰāĻŋāϝāĻŧ⧇āĻŦāϞāϕ⧇ āĻ—ā§āϞ⧋āĻŦāĻžāϞ āĻ…āĻŦāĻœā§‡āĻ•ā§āĻŸā§‡āϰ āϏāĻžāĻĨ⧇ āϝ⧋āĻ— āĻ•āϰ⧇āĨ¤ āύāĻŋāĻŽā§āύāϞāĻŋāĻ–āĻŋāϤ āωāĻĻāĻžāĻšāϰāĻŖ āĻĻ⧇āϖ⧁āύāσ

				
					var num = 7;

function sum(a, b) {
	return a + b;
}

console.log(window.sum); 
/**
ƒ sum(a,b) {
 return a + b;
}
*/
console.log(window.num); // 7

				
			

āϝāĻĻāĻŋ āφāĻĒāύāĻžāϰ āĻĒā§āϰ⧋āĻ—ā§āϰāĻžāĻŽā§‡ āĻ…āύ⧇āĻ• āĻ—ā§āϞ⧋āĻŦāĻžāϞ āϭ⧇āϰāĻŋāϝāĻŧ⧇āĻŦāϞ āĻāĻŦāĻ‚ āĻĢāĻžāĻ‚āĻļāύ āĻĨāĻžāϕ⧇, āϤāĻžāĻšāϞ⧇ āφāĻĒāύāĻžāϰ āĻĒā§āϰ⧋āĻ—ā§āϰāĻžāĻŽ āχāύāχāĻĢāĻŋāĻļāĻŋā§Ÿā§‡āĻ¨ā§āϟāϞāĻŋ āĻŽā§‡āĻŽā§‹āϰāĻŋ āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰāϤ⧇ āĻĒāĻžāϰ⧇ āĻāĻŦāĻ‚ āφāĻĒāύāĻžāϰ āĻ—ā§āϞ⧋āĻŦāĻžāϞ āϭ⧇āϰāĻŋā§Ÿā§‡āĻŦāϞ āĻāĻŦāĻ‚ āĻĢāĻžāĻ‚āĻļāύāϗ⧁āϞāĻŋ āĻ…āĻ¨ā§āϝ āϕ⧋āύ āϞāĻžāχāĻŦā§āϰ⧇āϰ⧀āϰ āϏāĻžāĻĨ⧇ āĻ•āύāĻĢā§āϞāĻŋāĻ•ā§āϟ āĻ•āϰāϤ⧇ āĻĒāĻžāϰ⧇ āϝāĻĻāĻŋ āϐ āϞāĻžāχāĻŦā§āϰ⧇āϰ⧀āϤ⧇ āĻāĻ•āχ āύāĻžāĻŽā§‡ āϭ⧇āϰāĻŋā§Ÿā§‡āĻŦāϞ āĻāĻŦāĻ‚ āĻĢāĻžāĻ‚āĻļāύ āĻĨāĻžāϕ⧇āĨ¤ āĻĢāĻžāĻ‚āĻļāύ āĻāĻŦāĻ‚ āϭ⧇āϰāĻŋāϝāĻŧ⧇āĻŦāϞāϗ⧁āϞāĻŋāϕ⧇ āĻ—ā§āϞ⧋āĻŦāĻžāϞ āĻ…āĻŦāĻœā§‡āĻ•ā§āϟ āĻ•āύāĻĢā§āϞāĻŋāĻ•ā§āϟ āĻ•āϰāĻž āĻĨ⧇āϕ⧇ āĻŦāĻŋāϰāϤ āϰāĻžāĻ–āĻžāϰ āĻāĻ•āϟāĻŋ āωāĻĒāĻžāϝāĻŧ āĻšāϞ IIFE āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰāĻžāĨ¤

āύ⧇āχāĻŽāĻĄ IIFE:

				
					(function domeSomeMagic() {
	// code goes here...
})();

				
			

IIFE āϏ⧇āĻŽāĻŋāϕ⧋āϞāύ āĻĻāĻŋā§Ÿā§‡āĻ“ āĻļ⧁āϰ⧁ āĻšāϤ⧇ āĻĒāĻžāϰ⧇āĨ¤ āϝ⧇āĻŽāύ:

				
					(function () {
	// code goes here...
})();

				
			

āĻāχ āϏāĻŋāύāĻŸā§āϝāĻžāĻ•ā§āϏ⧇, āĻĻ⧁āχ āĻŦāĻž āϤāϤ⧋āϧāĻŋāĻ• āϜāĻžāĻ­āĻžāĻ¸ā§āĻ•ā§āϰāĻŋāĻĒā§āϟ āĻĢāĻžāχāϞāϕ⧇ āĻāĻ•āĻ• āĻĢāĻžāχāϞ⧇ āĻŦāĻžāĻ¨ā§āĻĄāϞ āĻ•āϰāĻžāϰ āϜāĻ¨ā§āϝ⧇ āĻ¸ā§āĻŸā§‡āϟāĻŽā§‡āĻ¨ā§āϟāϟāĻŋ āĻļ⧇āώ āĻ•āϰāϤ⧇ āϏ⧇āĻŽāĻŋāϕ⧋āϞāύ āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰāĻž āĻšāϝāĻŧāĨ¤ āωāĻĻāĻžāĻšāϰāĻŖāĻ¸ā§āĻŦāϰ⧂āĻĒ, āφāĻĒāύāĻžāϰ āĻĻ⧁āϟāĻŋ āĻĢāĻžāχāϞ āφāϛ⧇ file1.js āĻāĻŦāĻ‚ file2.js āϝāĻž IIFE āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰ⧇āĨ¤

				
					/**
 * file1.js
 */

(function () {
	// ...
})();


/**
 * file2.js
 */
 
(function () {
// ...
})();
				
			

āϝāĻĻāĻŋ āφāĻĒāύāĻŋ āĻāĻ•āϟāĻŋ āϕ⧋āĻĄ āĻŦāĻžāĻ¨ā§āĻĄāϞāĻžāϰ āϟ⧁āϞ āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰ⧇ āωāĻ­āϝāĻŧ āĻĢāĻžāχāϞāϗ⧁āϞāĻŋāϰ āϕ⧋āĻĄāϕ⧇ āĻāĻ•āϟāĻŋ āĻāĻ•āĻ• āĻĢāĻžāχāϞ⧇āϰ āϕ⧋āĻĄ āĻ•āύāϕ⧇āϟ āĻ•āϰāϤ⧇ āϚāĻžāύ āϏ⧇āĻŽāĻŋāϕ⧋āϞāύ (;) āĻ›āĻžāĻĄāĻŧāĻž, āĻ•āύāĻ•āĻžāύ⧇āĻŸā§‡āĻĄ āϕ⧋āĻĄāϟāĻŋ āĻāĻ•āϟāĻŋ Uncaught TypeError: (intermediate value)(â€Ļ) is not a function āϏāĻŋāύāĻŸā§āϝāĻžāĻ•ā§āϏ āχāϰ⧇āϰ āĻĻāĻŋāĻŦ⧇āĨ¤

āϧāϰ⧁āύ āφāĻĒāύāĻžāϰ āύāĻŋāĻŽā§āύāϞāĻŋāĻ–āĻŋāϤ āĻĢāĻžāĻ‚āĻļāύ āϏāĻš math.js āύāĻžāĻŽā§‡ āĻāĻ•āϟāĻŋ āϞāĻžāχāĻŦā§āϰ⧇āϰāĻŋ āφāϛ⧇ āĻāĻŦāĻ‚ āĻāĻ•āϟāĻŋ HTML āĻĢāĻžāχāϞ⧇ math.js āϞ⧋āĻĄ āĻ•āϰ⧁āύāσ

				
					function add(a, b) {
	return a + b;
}

function sub(a, b) {
	return a - b;
}

function mult(a, b) {
	return a * b;
}

function div(a, b) {
	return a / b;
}

				
			
āĻĒāϰāĻŦāĻ°ā§āϤ⧀āϤ⧇, āφāĻĒāύāĻŋ āĻāĻ•āχ āĻĢāĻžāχāϞ⧇ anotherLibraby.js āύāĻžāĻŽā§‡ āφāϰ⧇āĻ•āϟāĻŋ āϜāĻžāĻ­āĻžāĻ¸ā§āĻ•ā§āϰāĻŋāĻĒā§āϟ āϞāĻžāχāĻŦā§āϰ⧇āϰāĻŋ āϞ⧋āĻĄ āĻ•āϰāϤ⧇ āϚāĻžāύāσ
				
					<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <title>JavaScript IIFE</title>
</head>

<body>
    <script data-cfasync="false" data-wpmeteor-after="REORDER" type="javascript/blocked" data-wpmeteor-type="text/javascript"  data-wpmeteor-src="math.js">x</script>
    <script data-cfasync="false" data-wpmeteor-after="REORDER" type="javascript/blocked" data-wpmeteor-type="text/javascript"  data-wpmeteor-src="anotherLibrary.js">x</script>
    <script data-cfasync="false" data-wpmeteor-after="REORDER" type="javascript/blocked" data-wpmeteor-type="text/javascript"  data-wpmeteor-src="app.js">x</script>
</body>

</html>
				
			
anotherLibrary.js āϞāĻžāχāĻŦā§āϰ⧇āϰ⧀āϤ⧇āĻ“ sub() āύāĻžāĻŽā§‡ āĻĢāĻžāĻ‚āĻļāύ āϰāϝāĻŧ⧇āϛ⧇ āϝ⧇āϟāĻŋ āĻāĻ•āϟāĻŋ āĻ¸ā§āĻŸā§āϰāĻŋāĻ‚ āϰāĻŋāϟāĻžāĻ°ā§āύ āĻ•āϰ⧇āσ
				
					function sub() {
	return "sub";
}

				
			
āϝāĻ–āύ āφāĻĒāύāĻŋ app.js āĻĢāĻžāχāϞ⧇ sub() āĻĢāĻžāĻ‚āĻļāύāϟāĻŋ āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰāĻŦ⧇āύ, āϤāĻ–āύ āĻāϟāĻŋ āĻĻ⧁āϟāĻŋ āϏāĻ‚āĻ–ā§āϝāĻžāϰ āĻŦāĻŋā§Ÿā§‹āϗ⧇āϰ āĻĒāϰāĻŋāĻŦāĻ°ā§āϤ⧇ sub āĻ¸ā§āĻŸā§āϰāĻŋāĻ‚ āϰāĻŋāϟāĻžāĻ°ā§āύ āĻ•āϰāĻŦ⧇āσ
				
					let result = sub(30, 20);
console.log(result); // sub

				
			
āĻ•āĻžāϰāĻŖ anotherLibrary.js āĻāϰ sub() āĻĢāĻžāĻ‚āĻļāύ math.js āϞāĻžāχāĻŦā§āϰ⧇āϰāĻŋāϰ sub() āĻĢāĻžāĻ‚āĻļāύāϕ⧇ āĻ“āĻ­āĻžāϰāϰāĻžāχāĻĄ āĻ•āϰ⧇ āĻĢ⧇āϞāϛ⧇āĨ¤ āĻāχ āϏāĻŽāĻ¸ā§āϝāĻž āĻ āĻŋāĻ• āĻ•āϰāϤ⧇, āφāĻĒāύāĻŋ math.js āĻ IIFE āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰāϤ⧇ āĻĒāĻžāϰ⧇āύāσ
				
					var math = (function () {
	function add(a, b) {
		return a + b;
	}

	function sub(a, b) {
		return a - b;
	}

	function mult(a, b) {
		return a * b;
	}

	function div(a, b) {
		return a / b;
	}

	return {
		add: add,
		sub: sub,
		mult: mult,
		div: div,
	};
})();

				
			
IIFE math āύāĻžāĻŽā§‡ āĻāĻ•āϟāĻŋ āĻ…āĻŦāĻœā§‡āĻ•ā§āϟ āϰāĻŋāϟāĻžāĻ°ā§āύ āĻ•āϰ⧇ āϝāĻžāϤ⧇ add, sub, mult, āĻāĻŦāĻ‚ div āĻŽā§‡āĻĨāĻĄ āĻšā§Ÿā§‡āϛ⧇āĨ¤ app.js āĻĢāĻžāχāϞ⧇, āφāĻĒāύāĻŋ math.js āϞāĻžāχāĻŦā§āϰ⧇āϰāĻŋ āύāĻŋāĻŽā§āύāϞāĻŋāĻ–āĻŋāϤāĻ­āĻžāĻŦ⧇ āĻŦā§āϝāĻŦāĻšāĻžāϰ āĻ•āϰāϤ⧇ āĻĒāĻžāϰ⧇āύāσ
				
					var result = math.sub(30, 20);
console.log(result); // 10
console.log(sub()); // sub

				
			

āĻĒā§āϰāĻĨāĻŽ sub() āĻĢāĻžāĻ‚āĻļāύāϕ⧇ math.sub() āĻĻāĻŋā§Ÿā§‡ āχāύāĻ­ā§‹āĻ• āĻ•āϰāĻž āĻšā§Ÿā§‡āϛ⧇ āϝ⧇āϟāĻŋ math.js āĻĨ⧇āϕ⧇ āĻāĻ•ā§āϏāĻĒā§‹āĻ°ā§āϟ āĻ•āϰāĻž āĻ…āĻ¨ā§āϝāĻĻāĻŋāϕ⧇ āĻĻā§āĻŦāĻŋāϤ⧀āϝāĻŧ sub() āĻĢāĻžāĻ‚āĻļāύāϕ⧇ anotherLibrary.js āĻĨ⧇āϕ⧇ āχāύāĻ­ā§‹āĻ• āĻ•āϰāĻž āĻšā§Ÿā§‡āϛ⧇āĨ¤

IIFE āĻāϰ āϏ⧁āĻŦāĻŋāϧāĻžāσ

  • āĻ…āĻĒā§āϰāϝāĻŧā§‹āϜāύ⧀āϝāĻŧ āĻ—ā§āϞ⧋āĻŦāĻžāϞ āϭ⧇āϰāĻŋāϝāĻŧ⧇āĻŦāϞ āĻāĻŦāĻ‚ āĻĢāĻžāĻ‚āĻļāύ āϤ⧈āϰāĻŋ āĻ•āϰ⧇ āύāĻžāĨ¤
  • IIFE āϤ⧇ āĻĄāĻŋāĻĢāĻžāχāύ āĻ•āϰāĻž āĻĢāĻžāĻ‚āĻļāύ āĻ“ āϭ⧇āϰāĻŋāϝāĻŧ⧇āĻŦāϞ āĻ…āĻ¨ā§āϝ āĻĢāĻžāĻ‚āĻļāύ āĻāĻŦāĻ‚ āϭ⧇āϰāĻŋāϝāĻŧ⧇āĻŦāϞ⧇āϰ āϏāĻžāĻĨ⧇ āĻ•āύāĻĢā§āϞāĻŋāĻ•ā§āϟ āĻ•āϰ⧇ āύāĻžāĨ¤ āĻāĻŽāύāĻ•āĻŋ āϤāĻžāĻĻ⧇āϰ āĻāĻ•āχ āύāĻžāĻŽ āĻĨāĻžāĻ•āϞ⧇āĻ“āĨ¤
  • āϜāĻžāĻ­āĻžāĻ¸ā§āĻ•ā§āϰāĻŋāĻĒā§āĻŸā§‡āϰ āϕ⧋āĻĄ āĻ…āĻ°ā§āĻ—āĻžāύāĻžāχāϜ āĻ•āϰ⧇āĨ¤
  • āϜāĻžāĻ­āĻžāĻ¸ā§āĻ•ā§āϰāĻŋāĻĒā§āϟ āϕ⧋āĻĄ āĻŽā§‡āχāĻ¨ā§āϟāĻžāύāĻžāĻŦāϞ āĻ•āϰ⧇āĨ¤
  • Normally, IIFE does not require a name. But even when we name an IIFE, it keeps on working.
 
 
 
(function greetings() {
    let message = “Hello, I am Sam Smith”;
    console.log(message);
}());
 
  • Execute an async function
 
 
 
const getFileStream = async (url) => {
    /* implementation */
};
 
(async () => {
    const stream = await getFileStream(‘https://www.vivasoftltd.com/file.ext’);
    for await (const chunk of stream) {
        console.log({ chunk });
    }
})();
 
  • IIFE that Takes Arguments
     
     
     
    (function (first, last) {
        alert(`My name is ${first} ${last}.`);
    })(“Lukman”, “Hussain”);
  • Use an IIFE to immediately execute the calculate function.
 
 
 
function calculate(){
    let a = 12;
    let b = 34;
    console.log(a + b);
}
 
  • Writing an IIFE that Takes 3 Arguments and return sum.
  • Write and IFFE that return an object.