Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Drop the semicolon after the function definition.</p> <pre><code>(function (msg){alert(msg)}) ('SO'); </code></pre> <p>Above should work.</p> <p>DEMO Page: <a href="https://jsfiddle.net/e7ooeq6m/" rel="noreferrer">https://jsfiddle.net/e7ooeq6m/</a></p> <p>I have discussed this kind of pattern in this post:</p> <p><a href="https://stackoverflow.com/questions/1122690/jquery-and-questions/1122740#1122740">jQuery and $ questions</a></p> <p><strong>EDIT:</strong></p> <p>If you look at <a href="http://www.ecma-international.org/publications/files/ECMA-ST/ECMA-262.pdf" rel="noreferrer">ECMA script specification</a>, there are 3 ways you can define a function. (Page 98, Section 13 Function Definition)</p> <h2>1. Using Function constructor</h2> <pre><code>var sum = new Function('a','b', 'return a + b;'); alert(sum(10, 20)); //alerts 30 </code></pre> <h2>2. Using Function declaration.</h2> <pre><code>function sum(a, b) { return a + b; } alert(sum(10, 10)); //Alerts 20; </code></pre> <h2>3. Function Expression</h2> <pre><code>var sum = function(a, b) { return a + b; } alert(sum(5, 5)); // alerts 10 </code></pre> <p>So you may ask, what's the difference between declaration and expression? </p> <p>From ECMA Script specification:</p> <blockquote> <p>FunctionDeclaration : function Identifier ( FormalParameterListopt ){ FunctionBody }</p> <p>FunctionExpression : function Identifieropt ( FormalParameterListopt ){ FunctionBody }</p> </blockquote> <p>If you notice, 'identifier' is <strong>optional</strong> for function expression. And when you don't give an identifier, you create an anonymous function. It doesn't mean that you can't specify an identifier.</p> <p>This means following is valid.</p> <pre><code>var sum = function mySum(a, b) { return a + b; } </code></pre> <p>Important point to note is that you can use 'mySum' only inside the mySum function body, not outside. See following example:</p> <pre><code>var test1 = function test2() { alert(typeof test2); } alert(typeof(test2)); //alerts 'undefined', surprise! test1(); //alerts 'function' because test2 is a function. </code></pre> <p><a href="http://jsbin.com/esupa" rel="noreferrer">Live Demo</a></p> <p>Compare this to</p> <pre><code> function test1() { alert(typeof test1) }; alert(typeof test1); //alerts 'function' test1(); //alerts 'function' </code></pre> <hr> <p>Armed with this knowledge, let's try to analyze your code.</p> <p>When you have code like, </p> <pre><code> function(msg) { alert(msg); } </code></pre> <p>You created a function expression. And you can execute this function expression by wrapping it inside parenthesis.</p> <pre><code> (function(msg) { alert(msg); })('SO'); //alerts SO. </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload