2.8 āĻāĻžāĻāĻžāĻ¸ā§āĻā§āĻ°āĻŋāĻĒā§āĻā§ āĻā§āĻ˛ā§āĻāĻžāĻ°
Closure āĻā§āĻ¨ āĻĢāĻžāĻāĻļāĻ¨ āĻ¨āĻž āĻāĻŦāĻžāĻ° āĻĢāĻžāĻāĻļāĻ¨āĻ āĻā§āĻ¨ closure āĻ¨āĻžāĨ¤ Closure āĻšāĻā§āĻā§ āĻĢāĻžāĻāĻļāĻ¨ā§āĻ° āĻāĻŽāĻ¨ āĻāĻāĻāĻž āĻŦā§āĻļāĻŋāĻˇā§āĻā§āĻ¯ āĻ¯ā§ āĻŦā§āĻļāĻŋāĻˇā§āĻā§āĻ¯ā§āĻ° āĻāĻžāĻ°āĻŖā§ āĻĢāĻžāĻāĻļāĻ¨ āĻāĻā§āĻ¸āĻŋāĻāĻŋāĻāĻļāĻ¨ āĻļā§āĻˇ āĻšā§ā§ āĻ¯āĻžāĻŦāĻžāĻ° āĻĒāĻ°ā§āĻ āĻ¤āĻžāĻ° lexical scope āĻ āĻ āĻŦāĻ¸ā§āĻĨāĻŋāĻ¤ āĻ¸āĻāĻ˛ variable āĻā§ āĻŽāĻ¨ā§ āĻ°āĻžāĻāĻ¤ā§ āĻĒāĻžāĻ°ā§āĨ¤ āĻāĻĻāĻžāĻšāĻ°āĻŖāĻ¸ā§āĻŦāĻ°ā§āĻĒ āĻŦāĻ˛āĻž āĻ¯ā§āĻ¤ā§ āĻĒāĻžāĻ°ā§ āĻ¯ā§ āĻĄāĻŽ āĻĨā§āĻā§ āĻāĻŋāĻā§ āĻ ā§āĻ¯āĻžāĻā§āĻ¸ā§āĻ¸ āĻāĻ°āĻžāĻ° āĻāĻ¨ā§āĻ¯ā§ āĻāĻŽāĻ°āĻž āĻ¯ā§ āĻāĻā§āĻ¨ā§āĻ āĻĢāĻžāĻā§āĻžāĻ° āĻāĻ°āĻŋ āĻ¸ā§āĻāĻžāĻ āĻāĻāĻāĻž closureāĨ¤
āĻāĻŋāĻā§ āĻāĻĻāĻžāĻšāĻ°āĻŖāĻ
function add(a) {
return function (b) {
return a + b;
};
}
let addTen = add(10);
let addSeven = addTen(7);
console.log(addSeven); // 17
āĻāĻŋ āĻšāĻā§āĻā§ āĻāĻ¸āĻŦ?? āĻ āĻŋāĻ āĻāĻā§, āĻāĻ˛ā§āĻ¨ āĻĻā§āĻāĻŋ āĻā§āĻĄāĻā§āĻ˛ā§āĻā§ āĻā§āĻā§āĻā§āĻ-
ā§§āĨ¤ āĻ¯āĻāĻ¨ add āĻĢāĻžāĻāĻļāĻ¨āĻāĻŋ āĻāĻ˛ āĻšā§ āĻāĻāĻŋ āĻāĻ°ā§āĻāĻāĻŋ āĻĢāĻžāĻāĻļāĻ¨āĻā§ return āĻāĻ°ā§āĨ¤
ā§¨āĨ¤ āĻ āĻĢāĻžāĻāĻļāĻ¨āĻāĻŋāĻ° āĻāĻā§āĻ¸āĻŋāĻāĻŋāĻāĻļāĻ¨ āĻļā§āĻˇ āĻšā§ā§ āĻ¯āĻžā§ āĻāĻŦāĻ āĻŽāĻ¨ā§ āĻ°āĻžāĻā§ āĻ āĻ¸āĻŽā§ āĻ¤āĻžāĻ° āĻĒā§āĻ¯āĻžāĻ°āĻžāĻŽāĻŋāĻāĻžāĻ° a āĻāĻ° āĻā§āĻ¯āĻžāĻ˛ā§ āĻāĻŋ āĻāĻŋāĻ˛āĨ¤
ā§ŠāĨ¤ āĻ¯āĻāĻ¨ addTen āĻā§āĻ°āĻŋā§ā§āĻŦāĻ˛ā§ add āĻĢāĻžāĻāĻļāĻ¨āĻā§ āĻāĻ¸āĻžāĻāĻ¨ āĻāĻ°āĻž āĻšā§āĨ¤ āĻāĻāĻŋ āĻ¸āĻŦ āĻ¸āĻŽā§ āĻŽāĻ¨ā§ āĻ°āĻžāĻāĻŦā§ a āĻāĻ° āĻā§āĻ¯āĻžāĻ˛ā§ āĻāĻŋ āĻāĻŋāĻ˛ āĻ¯āĻāĻ¨ āĻāĻāĻŋāĻā§ āĻāĻ¨āĻŋāĻļāĻŋā§āĻžāĻ˛āĻŋ āĻāĻ˛ āĻāĻ°āĻž āĻšā§ā§āĻāĻŋāĻ˛āĨ¤
ā§ĒāĨ¤ āĻāĻĒāĻ°ā§āĻ° addTen āĻā§āĻ°āĻŋā§ā§āĻŦāĻ˛ āĻāĻāĻāĻŋ āĻĢāĻžāĻāĻļāĻ¨āĻā§ āĻŦā§āĻāĻžā§ āĻ¯ā§āĻāĻŋ āĻ¸āĻŦ āĻ¸āĻŽā§ āĻā§āĻ¯āĻžāĻ˛ā§ ā§§ā§Ļ āĻ¯ā§āĻ āĻāĻ°āĻŦā§ āĻ¯āĻž āĻĒāĻžāĻ āĻžāĻ¨ā§ āĻšā§ā§āĻāĻŋāĻ˛āĨ¤
ā§ĢāĨ¤ āĻ¤āĻžāĻ° āĻŽāĻžāĻ¨ā§ āĻšāĻ˛ āĻ¯āĻāĻ¨ addTen āĻā§ āĻāĻ˛ āĻāĻ°āĻž āĻšā§ ā§ āĻā§āĻ¯āĻžāĻ˛ā§ āĻĻāĻŋā§ā§, āĻāĻāĻŋ ā§§ā§Ļ āĻāĻ° āĻ¸āĻžāĻĨā§ ā§ āĻ¯ā§āĻ āĻāĻ°āĻŦā§ āĻāĻŦāĻ ā§§ā§ āĻ°āĻŋāĻāĻžāĻ°ā§āĻ¨ āĻāĻ°āĻŦā§āĨ¤
āĻ¸ā§āĻ¤āĻ°āĻžāĻ, āĻāĻžāĻāĻžāĻ¸ā§āĻā§āĻ°āĻŋāĻĒā§āĻ āĻāĻā§āĻāĻŋāĻ¨ addTen āĻā§ āĻ¯ā§āĻāĻžāĻŦā§ āĻ°āĻžāĻ¨ āĻāĻ°ā§āĻ-
function addTen(b) {
return 10 + b;
}
āĻāĻāĻ¨ āĻāĻāĻāĻž āĻŽāĻāĻžāĻ° āĻāĻĻāĻžāĻšāĻ°āĻŖ āĻĻā§āĻāĻŦā§āĨ¤ āĻāĻŋāĻāĻžāĻŦā§ āĻāĻŽāĻ°āĻž āĻ˛ā§āĻĒā§āĻ° āĻāĻŋāĻ¤āĻ°ā§ āĻā§āĻ˛ā§āĻāĻžāĻ° āĻāĻžāĻ˛āĻžāĻ¤ā§ āĻĒāĻžāĻ°āĻŋāĨ¤ āĻāĻāĻŋ āĻāĻ¨ā§āĻāĻžāĻ°ā§āĻāĻŋāĻ āĻŦā§āĻ°ā§āĻĄā§āĻ° āĻāĻāĻāĻž āĻāĻŽāĻ¨ āĻĒā§āĻ°āĻļā§āĻ¨āĨ¤ āĻ¨āĻŋāĻā§āĻ° āĻā§āĻĄāĻāĻž āĻĻā§āĻā§āĻ¨ āĻāĻŦāĻ āĻāĻāĻā§ āĻŽāĻ¨ā§ āĻŽāĻ¨ā§ āĻāĻŋāĻ¨ā§āĻ¤āĻž āĻāĻ°ā§āĻ¨ āĻāĻāĻžāĻ° āĻāĻāĻāĻĒā§āĻ āĻāĻ¤ āĻšāĻŦā§āĨ¤
for (var i = 1; i <= 5; i++) {
setTimeout(() => console.log(i), 1000);
}
// āĻāĻžāĻā§āĻā§āĻˇāĻŋāĻ¤ āĻāĻāĻāĻĒā§āĻāĻ -
// 1
// 2
// 3
// 4
// 5
// āĻāĻŋāĻ¨ā§āĻ¤ā§ āĻāĻ¸āĻā§ āĻ
āĻ¨āĻžāĻāĻžāĻā§āĻā§āĻˇāĻŋāĻ¤ āĻāĻāĻāĻĒā§āĻāĻ-
// 6
// 6
// 6
// 6
// 6
āĻāĻ¸āĻ˛ā§ āĻāĻ āĻāĻāĻāĻĒā§āĻ āĻāĻ¸āĻžāĻ° āĻ āĻ¨ā§āĻ āĻāĻžāĻ°āĻŖ āĻāĻā§āĨ¤ āĻ˛ā§āĻĒā§āĻ° āĻŽāĻžāĻā§ āĻā§āĻ¯āĻžāĻ°āĻŋā§ā§āĻŦāĻ˛ i āĻšāĻā§āĻā§ āĻāĻāĻāĻŋ āĻā§āĻ˛ā§āĻŦāĻžāĻ˛ āĻā§āĻ¯āĻžāĻ°āĻŋā§ā§āĻŦāĻ˛āĨ¤ āĻ¯āĻāĻ¨ setTimeout āĻ°āĻžāĻ¨ āĻšā§ āĻ¤āĻžāĻ° āĻāĻā§āĻ āĻ˛ā§āĻĒ āĻļā§āĻˇ āĻšā§ā§ āĻ¯āĻžā§ āĻāĻŦāĻ āĻ¤āĻžāĻ i āĻā§āĻ¯āĻžāĻ˛ā§ 6 āĻšā§ā§ āĻ¯āĻžā§āĨ¤ āĻ¸ā§āĻāĻ¨ā§āĻ¯ā§ āĻĒā§āĻ°āĻ¤āĻŋ āĻāĻ āĻ¸ā§āĻāĻ¨ā§āĻĄ āĻĒāĻ° āĻĒāĻ° āĻĒāĻžāĻāĻāĻŦāĻžāĻ° 6 āĻĻā§āĻāĻžāĻā§āĻā§āĨ¤ āĻ¯āĻĻāĻŋ āĻŦāĻŋāĻļā§āĻŦāĻžāĻ¸ āĻ¨āĻž āĻšā§ āĻ¤āĻžāĻšāĻ˛ā§ āĻā§āĻĄāĻāĻž āĻ°āĻžāĻ¨ āĻāĻ°āĻžāĻ° āĻĒāĻ° āĻāĻĒāĻ¨āĻžāĻ° āĻā§āĻ˛ā§āĻŦāĻžāĻ˛ window āĻ āĻŦāĻā§āĻā§āĻāĻāĻž āĻāĻāĻŦāĻžāĻ° āĻĻā§āĻā§āĻ¨ āĻ¸ā§āĻāĻžāĻ¨ā§ i āĻ¨āĻžāĻŽā§ āĻāĻāĻāĻž āĻā§āĻ¯āĻžāĻ°āĻŋā§ā§āĻŦāĻ˛ āĻĻā§āĻāĻ¤ā§ āĻĒāĻžāĻ°āĻŦā§āĻ¨ āĻāĻŦāĻ āĻ¤āĻžāĻ° āĻā§āĻ¯āĻžāĻ˛ā§ 6 āĻšā§ā§ āĻāĻā§āĨ¤
āĻāĻ āĻ¸āĻŽāĻ¸ā§āĻ¯āĻžāĻ° āĻ¸āĻŽāĻžāĻ§āĻžāĻ¨ āĻāĻŽāĻ°āĻž IIFE āĻŦāĻž Immediately Invoked Function Expression āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ° āĻāĻ°ā§ āĻāĻ°āĻ¤ā§ āĻĒāĻžāĻ°āĻŋāĨ¤ āĻ¨āĻŋāĻā§ āĻāĻĻāĻžāĻšāĻ°āĻŖ āĻĻā§āĻā§āĻž āĻšāĻ˛āĻ-
āĻĒāĻĻā§āĻ§āĻ¤āĻŋ ā§§āĻ
for (var i = 1; i <= 5; i++) {
(function () {
var val = i;
setTimeout(() => console.log(val), 1000);
})();
}
āĻĒāĻĻā§āĻ§āĻ¤āĻŋ ā§¨āĻ
for (var i = 1; i <= 5; i++) {
(function (val) {
setTimeout(() => console.log(val), 1000);
})(i);
}
āĻāĻāĻžāĻ¨ā§ āĻāĻŽāĻ°āĻž āĻāĻāĻāĻž āĻĢāĻžāĻāĻļāĻ¨ āĻ˛āĻŋāĻā§ āĻāĻāĻāĻž Scope āĻ¤ā§āĻ°āĻŋ āĻāĻ°ā§āĻāĻŋāĨ¤ āĻĢāĻžāĻāĻļāĻ¨āĻāĻŋāĻā§ āĻāĻŽāĻŋāĻĄāĻŋā§ā§āĻāĻ˛āĻŋ āĻāĻ˛ āĻāĻ°ā§āĻāĻŋ āĻāĻŦāĻ āĻ¤āĻžāĻ° āĻĒā§āĻ¯āĻžāĻ°āĻžāĻŽāĻŋāĻāĻžāĻ°ā§āĻ° āĻā§āĻ¯āĻžāĻ˛ā§ āĻšāĻŋāĻ¸āĻžāĻŦā§ i āĻā§ āĻĒāĻžāĻ¸ āĻāĻ°ā§āĻāĻŋāĨ¤ āĻāĻ¤ā§ āĻ¸ā§ āĻāĻāĻ¨ i āĻāĻ° āĻā§āĻ¯āĻžāĻ˛ā§āĻā§ āĻŽāĻ¨ā§ āĻ¨āĻž āĻ°ā§āĻā§ āĻ¸ā§ āĻāĻāĻ¨ āĻ¤āĻžāĻ° āĻĒā§āĻ¯āĻžāĻ°āĻžāĻŽāĻŋāĻāĻžāĻ°ā§āĻ° āĻā§āĻ¯āĻžāĻ˛ā§āĻā§Â āĻŽāĻ¨ā§ āĻ°āĻžāĻāĻŦā§āĨ¤ āĻŽāĻžāĻ¨ā§ āĻāĻāĻ¨ i āĻāĻ° āĻŽāĻžāĻ¨ 1, 2 āĻāĻ°ā§ āĻ¯āĻžāĻā§āĻā§ āĻāĻŦāĻ āĻ¸ā§āĻāĻž āĻĨā§āĻā§ āĻāĻāĻāĻž āĻāĻ˛āĻžāĻĻāĻž Scope āĻ¤ā§āĻ°āĻŋ āĻšāĻā§āĻā§ āĻ¯ā§āĻāĻžāĻā§ āĻ¸ā§ āĻŽāĻ¨ā§ āĻ°āĻžāĻāĻā§āĨ¤
āĻĒāĻĻā§āĻ§āĻ¤āĻŋ ā§ŠāĻ
for (let i = 1; i <= 5; i++) {
setTimeout(() => console.log(i), 1000);
}
// Output:
// 1
// 2
// 3
// 4
// 5
āĻ āĻŦāĻļā§āĻˇā§ āĻāĻŽāĻžāĻĻā§āĻ° āĻāĻžāĻā§āĻā§āĻˇāĻŋāĻ¤ āĻāĻāĻāĻĒā§āĻ āĻĒā§āĻ˛āĻžāĻŽāĨ¤ āĻ¤āĻŦā§ āĻāĻ āĻāĻ āĻĒāĻ°ā§āĻ¯āĻ¨ā§āĻ¤āĻ āĻāĻĨāĻž āĻšāĻŦā§ āĻĒāĻ°āĻŦāĻ°ā§āĻ¤ā§āĻ¤ā§ āĻ āĻ¨ā§āĻ¯ āĻā§āĻ¨ā§ āĻāĻĒāĻŋāĻ āĻ¨āĻŋā§ā§āĨ¤
- for (var count = 1; count <= 5; count++) {Â Â setTimeout(() => console.log(count), 1000);}Â// Output:// 6// 6// 6// 6// 6
var āĻā§āĻāĻ¯āĻŧāĻžāĻ°ā§āĻĄ āĻĢāĻžāĻāĻļāĻ¨ āĻ¸ā§āĻā§āĻĒ āĨ¤ āĻ¤āĻžāĻ āĻ¯āĻāĻ¨ āĻāĻŽāĻ°āĻž āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ° āĻāĻ°ā§ āĻā§āĻ°āĻŋāĻ¯āĻŧā§āĻŦāĻ˛ āĻ¤ā§āĻ°āĻŋ āĻāĻ°āĻŋ āĻāĻāĻ āĻā§āĻ°āĻŋāĻ¯āĻŧā§āĻŦāĻ˛ āĻ¨āĻžāĻŽā§āĻ° var āĻā§āĻāĻ¯āĻŧāĻžāĻ°ā§āĻĄ, āĻāĻāĻŋ āĻ¸āĻŦāĻ¸āĻŽāĻ¯āĻŧ āĻāĻāĻ āĻā§āĻ°āĻŋāĻ¯āĻŧā§āĻŦāĻ˛ā§āĻ° āĻĻāĻŋāĻā§ āĻ¨āĻŋāĻ°ā§āĻĻā§āĻļ āĻāĻ°ā§āĨ¤ āĻāĻāĻžāĻ¨ā§ āĻāĻŽāĻ°āĻž āĻ ā§āĻ¯āĻžāĻ¸āĻŋāĻā§āĻā§āĻ°ā§āĻ¨āĻžāĻ¸ āĻĢāĻžāĻāĻļāĻ¨ āĻ¸ā§āĻāĻāĻžāĻāĻŽāĻāĻāĻ āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ° āĻāĻ°āĻŋāĨ¤ āĻ¸āĻŽāĻ¯āĻŧ āĻļā§āĻˇ āĻšāĻ˛ā§ āĻāĻžāĻāĻŽāĻāĻāĻā§āĻ° āĻĒāĻ°ā§ āĻ ā§āĻ¯āĻžāĻ¸āĻŋāĻā§āĻā§āĻ°ā§āĻ¨āĻžāĻ¸āĻāĻžāĻŦā§ āĻāĻžāĻ°ā§āĻ¯āĻāĻ° āĻāĻ°āĻž āĻšāĻ¯āĻŧ, āĻāĻŖāĻ¨āĻžāĻ° āĻŽāĻžāĻ¨ āĻāĻ¤āĻŋāĻŽāĻ§ā§āĻ¯ā§ 6 āĻšāĻ¯āĻŧā§ āĻā§āĻā§āĨ¤ āĻāĻžāĻ°āĻŖ āĻāĻāĻŋ 5 āĻĒāĻ°ā§āĻ¯āĻ¨ā§āĻ¤ āĻ˛ā§āĻĒ āĻāĻžāĻ˛āĻŋāĻ¯āĻŧā§ āĻ¯āĻžāĻŦā§ āĻāĻŦāĻ āĻ¤āĻžāĻ°āĻĒāĻ°ā§ āĻāĻ°ā§āĻāĻāĻŋ āĻāĻ¨āĻā§āĻ°āĻŋāĻŽā§āĻ¨ā§āĻ āĻ āĻĒāĻžāĻ°ā§āĻļāĻ¨ āĻāĻžāĻāĻ¨ā§āĻā§āĻ° āĻŽāĻžāĻ¨ 6 āĻ āĻŦā§āĻĻā§āĻ§āĻŋ āĻāĻ°ā§āĨ¤ āĻ¤āĻžāĻ āĻāĻāĻŋ āĻĒāĻžāĻāĻāĻŦāĻžāĻ°ā§āĻ° āĻāĻ¨ā§āĻ¯ 6 āĻĒā§āĻ°āĻŋāĻ¨ā§āĻ āĻāĻ°āĻŦā§ āĻāĻŽāĻ°āĻž āĻā§āĻ˛ā§āĻāĻžāĻ° āĻŦā§āĻ¯āĻŦāĻšāĻžāĻ° āĻāĻ°ā§ āĻāĻ āĻ¸āĻŽāĻ¸ā§āĻ¯āĻž āĻ¸āĻŽāĻžāĻ§āĻžāĻ¨ āĻāĻ°āĻ¤ā§ āĻĒāĻžāĻ°āĻŋ āĨ¤
- āĻ¸ā§āĻ˛ā§āĻĢ āĻāĻ¨āĻā§āĻāĻŋāĻ āĻĢāĻžāĻāĻļāĻ¨ā§ āĻā§āĻ˛ā§āĻāĻžāĻ°const add = (function () {Â Â let counter = 0;Â Â return function () {Â Â Â Â counter += 1;Â Â Â Â return counter;Â Â };})();Âadd();add();add();
- Every closure has three scopes:
Local Scope (Own scope)
Outer Functions Scope
Global ScopeHereâs a series of nested functions, all of which have access to the outer functionsâ scope. In this context, we can say that closures have access to all outer function scopes.// global scopevar e = 10;function sum(a) {  return function (b) {    return function (c) {      // outer functions scope      return function (d) {        // local scope        return a + b + c + d + e;      };    };  };};Âconsole.log(sum(1)(2)(3)(4)); // log 20
- āĻāĻžāĻāĻžāĻ¸ā§āĻā§āĻ°āĻŋāĻĒā§āĻā§ āĻā§āĻ˛ā§āĻāĻžāĻ° āĻāĻŋ?
- āĻāĻžāĻāĻžāĻ¸ā§āĻā§āĻ°āĻŋāĻĒā§āĻā§ āĻā§āĻ˛ā§āĻāĻžāĻ° āĻ¸ā§āĻŦāĻŋāĻ§āĻž āĻāĻŋ?
āĻ¨āĻŋāĻā§āĻ° āĻā§āĻĄā§āĻ° āĻāĻāĻāĻĒā§āĻ āĻāĻŋ āĻšāĻŦā§?
const multiply = (x) => {Â Â return function (y) {Â Â Â Â return x * y;Â Â };};Âlet multiply10 = multiply(10);let multiplyFive = multiply10(5);Âconsole.log(multiplyFive);- āĻ¨āĻŋāĻā§āĻ° āĻā§āĻĄā§āĻ° āĻāĻāĻāĻĒā§āĻ āĻāĻŋ āĻšāĻŦā§?for (var count = 1; count <= 5; count++) {Â Â setTimeout(() => console.log(count), 1000);}
