最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

Difference between closures and IIFE's in javascript - Stack Overflow

programmeradmin4浏览0评论

According to the Closures concept it will store the variables of the outer lexical environment for future execution of its inner function. For example:

function makeYounger(age) {
    function b() { 
        console.log("Original age is :" + age); 
    }
    b();
    return(function() { 
        return age / 2;
    }); 
}
var displayAge = makeYounger(20); 
console.log(displayAge());

In the above scenario, age is preserved by the Javascript engine to execute the inner function present in the return method.

Here es the IIFE:

 (function(window) { 
     var greeting = "Hello"; 
     var fNameSpace1 = { 
         name : "Appu", 
         callName : function() { 
             console.log(greeting + fNameSpace1.name);
         } 
     };
     window.doer = fNameSpace1; 
 }) (window);

 fNameSpace1.callName(); //To execute the inner function

In the above scenario according to the closures concept the variables greeting and fNameSpace1.name will be stored for future execution of the callname() function. Instead we are making use of the window object. I am confused why we are going with window if we have closures?

According to the Closures concept it will store the variables of the outer lexical environment for future execution of its inner function. For example:

function makeYounger(age) {
    function b() { 
        console.log("Original age is :" + age); 
    }
    b();
    return(function() { 
        return age / 2;
    }); 
}
var displayAge = makeYounger(20); 
console.log(displayAge());

In the above scenario, age is preserved by the Javascript engine to execute the inner function present in the return method.

Here es the IIFE:

 (function(window) { 
     var greeting = "Hello"; 
     var fNameSpace1 = { 
         name : "Appu", 
         callName : function() { 
             console.log(greeting + fNameSpace1.name);
         } 
     };
     window.doer = fNameSpace1; 
 }) (window);

 fNameSpace1.callName(); //To execute the inner function

In the above scenario according to the closures concept the variables greeting and fNameSpace1.name will be stored for future execution of the callname() function. Instead we are making use of the window object. I am confused why we are going with window if we have closures?

Share Improve this question edited Jan 22, 2020 at 0:42 Clonkex 3,6378 gold badges41 silver badges63 bronze badges asked Dec 19, 2016 at 18:31 CodeForHappinessCodeForHappiness 371 silver badge3 bronze badges 3
  • That fNameSpace1.callName(); at the end will fail. The global is called doer, not fNameSpace1. – T.J. Crowder Commented Dec 19, 2016 at 18:33
  • It's not clear what you're asking. If the question is "what's the difference between closures and IIFEs" the answer is "an IIFE is one specific way to create a closure." If the question is "Why are we going with window if we have closures?" the answer is: Because the author wanted to have a global variable. – T.J. Crowder Commented Dec 19, 2016 at 18:34
  • My question is what is the exact use of window object in this scenario if the javascript engine already stores fNameSpace1 object.Why are we creating a reference using window? – CodeForHappiness Commented Dec 19, 2016 at 18:38
Add a ment  | 

2 Answers 2

Reset to default 3

Difference between closures and IIFE's in javascript

An IIFE is just one specific way to A) Create a closure over the context in which it's defined, and B) Create a context in which to create other closures.

My question is what is the exact use of window object in this scenario if the javascript engine already stores fNameSpace1 object.Why are we creating a reference using window?

So it can be used outside the IIFE, by referring to it via the doer global that window.doer = ... creates.

There are dozens of different ways to do this. One of them does it by assigning to window like that. Another does it by returning the value and using a var statement:

var doer = (function() {
   // ...
   return fNamespace1;
})();

but again, there are dozens of different formations. The author of that particular one just preferred to write to a property on window as the way to create the global.

IIFE is useful to avoid global variable pollution when multiple functions are accessing a global variable

Closure functions are helpful when working with a local variable.

发布评论

评论列表(0)

  1. 暂无评论