javascript (function(window){})(window)

Question

The code in https://github.com/mattdiamond/Recorderjs/blob/master/recorder.js

I don't understand the javascript syntax like

(function(window){
  // blah-blah
})(window)

When I tried the code follow, I could see "hello world" in the console.

(function(window){
  console.log("hello world");
})(window)

What does this mean? Any references?

Thanks in advance

Immediately invoked function, with `window` object as a parameter. — Artyom Neustroev, Mar 28 '14 at 06:37
It's called an IIFE (immediately invoked function expression). See http://benalman.com/news/2010/11/immediately-invoked-function-expression/ for detailed explanation. In a nutshell, it's a way of creating an immediately run private function context. that is isolated from the global context. — jfriend00, Mar 28 '14 at 06:54
possible duplicate of [Immediately-Invoked Function Expression (IIFE) In JavaScript - Passing jQuery](http://stackoverflow.com/questions/12332353/immediately-invoked-function-expression-iife-in-javascript-passing-jquery) — jfriend00, Mar 28 '14 at 06:54

score 4 · Accepted Answer · answered Mar 28 '14 at 06:37

4

What does this mean? Any references?

It simply executes the bracketed function, just as if it's splitted as:

f = (function(window){
  console.log("hello world");
})
f(window)

answered Mar 28 '14 at 06:37

LeleDumbo

9,192
4
24
38

The difference between what you've coded and what the OP asked about is that there is no global symbol defined with the IIFE whereas you define the symbol `f()`. – jfriend00 Mar 28 '14 at 06:55

Dimag Kharab · Answer 2 · 2014-03-28T07:04:36.983

In any JavaScript file if you write something like:

justFunction();

//function declaration    
function justFunction() 
{ 
    alert("something");
}

This will call the justFunction() and show an alert. Defining a function like that is known as function declaration.

Now there is another way to define a function

var anotherFunction = function() { alert ("something")}

Now if you write something like

anotherFunction(); 

// Function Expression 
var anotherFunction = function() { alert ("something"); }

Although anotherFunction is a function here this will give an error in console. This is known as function expression.

The reason behind that is function declarations loads before any code is executed. While function expressions loads only when the interpreter reaches that line of code. So if you try to call a function expression before it's loaded, you'll get an error.

But if you call a function declaration, it'll always work. Because no code can be called until all declarations are loaded. So you will have to always call the function expression after it is defined.

// Function Expression 
var anotherFunction = function() { alert ("something"); } 
anotherFunction();

Now a function expression can be called immediately by adding parenthesis after the anonymous function like

var anotherFunction = function() { alert ("something"); }(); //paranthesis added

This code snippet and the above does the same thing (shows the alert). Now the anotherFunction variable is not the same as above because it is now assigned with the value , that the anonymous function will return. Right now it is not returning anything so anotherFunction is undefined. So if you write something like

var anotherFunction = function() { alert ("something"); }();
anotherFunction(); //error

This will give an error, because the anonymous function does not return any function. If its returns something like

var anotherFunction = 
  function() { alert ("something"); return "some string"; }(); //returns string

anotherFunction is now a string variable. And if:

var anotherFunction = function() { alert ("something"); return function(){
        alert("somethingElse")
        }; }();  // returns function

Now anotherFunction is a function and can be called like anotherFunction().

You can pass parameters to this function expression like

var anotherFunction = function(p1,p2) { console.log(p1); 
        console.log(p2); }(param1,param2 ); //param1,param2 are parameters

One of the main difference between a function expression and a function declaration is that A function expression can be called (invoked) immediately by using a set of parentheses, but a function declaration cannot be.

Now if we don't want to assign the function expression to a variable, then we have to write it inside parenthesis.

(function() { alert ("something");});

And to call it we need to add another set of parenthesis at the end like

(function() { alert ("something"); }());

And same as earlier, we can also pass parameters to it like:

( function(param){ console.log(param); }(param));

This type of functions are ## Heading ##called IIFE (Immediately Invoked Function Expression).

IFFE is just an anonymous function (no name attached to it) that is wrapped inside of a set of parentheses and called (invoked) immediately.

( function(){ }());

REFERNCE

score 0 · Answer 3 · answered Mar 28 '14 at 06:49

Consider this example.

var message = 'hello world';
function Say(msg){
    console.log(msg);
}
new Say(message);

You can make it self invoking anonymous function by wrapping the Say() without a name with parentheses and adding another parentheses after it and pass the message to it.

(function(msg){
    console.log(msg);
})(message);

javascript (function(window){})(window)

3 Answers3