This question already has answers here:
Explain the encapsulated anonymous function syntax
(10 answers)
Javascript anonymous function call [duplicate]
(4 answers)
Closed 8 years ago.
Very straight-forward, so the question is why
(function(){ console.log('a'); }()); // 'a'
or
(function(){ console.log('a'); })(); // 'a'
work, but
function(){ console.log('a'); }() // SyntaxError: Unexpected token (
gives an error? What's the meaning behind this behavior? Or what's the purpose of those extra parentheses?
The extra parentheses convert the function into a function expression instead of a function declaration.
Only a function expression can be invoked immediately with the trailing ().
There is no clear explanation for that. JavaScript simply can't parse function(){ console.log('a'); }() successfully. This also happens with other examples, like this one:
1.toString(); // Syntax error
(1).toString(); // Works
An (working) alternative to your code would be (note the ! at the beginning):
!function(){ console.log('a'); }()
Related
This question already has answers here:
Explain the encapsulated anonymous function syntax
(10 answers)
Location of parenthesis for auto-executing anonymous JavaScript functions?
(4 answers)
strange observation on IIFE in node.js (Windows)
(2 answers)
Closed 15 days ago.
In Javascript, I can define and call an IIFE as such:
(function() {
console.log("foo");
})();
As I understand it, this defines an anonymous function (thus the parentheses surrounding the function definition) and then immediately invokes it (thus the following parentheses, ()).
I noticed that the following also produces the same result:
(function() {
console.log("foo");
}());
Why is that? If I were to skip the parentheses surrounding the entire definition, it would cause an error:
function() {
console.log("foo");
}();
This results in SyntaxError: Function statements require a function name. How does the interpreter understand the second definition and why does it work?
This question already has answers here:
What is the (function() { } )() construct in JavaScript?
(28 answers)
Closed 2 years ago.
I came across with a piece of code with new syntax for me, What this syntax means in js? I mean this parentheses at the beginning:
(function () {
//...
})()
It's called IIFE
basically, you can define a a function and invoke it immediately without declaring a name for it.
This question already has answers here:
Why a Name Function Expression not available outside function body [duplicate]
(3 answers)
How do JavaScript closures work?
(86 answers)
Closed 7 years ago.
I'm curious, why not just javascript function scope it? Why just add a parenthesis can not access it? My guess is that the parentheses and javascript related operations, but do not know exactly why this child principle and design?
(function test(){
console.log( test );
})();
test();//Uncaught ReferenceError: test is not defined IE8- is ok
or
(function test(){
console.log( test );
});
test();//Uncaught ReferenceError: test is not defined IE8- is ok
When you wrap a function in parentheses like you did, it does put it in a new scope.
It also acts like a return value, which is why it can be called as an IIFE, or Immediately Invoking Function Expression.
Another way to re-write it, which will make more sense is like so:
var myFunc = (function test(){
alert('Hello!');
});
myFunc(); // Works!
test(); // Doesn't work!
To learn more about this, you should read about IIFE - Immediately-invoked function expression.
The short version - the function runs in its own scope, unless you pass parameters to it, like so:
(function test(x) {
alert(x); //alerts "yey!";
})("yey!");
This question already has answers here:
Javascript anonymous function call [duplicate]
(4 answers)
Closed 9 years ago.
How come
function(){ alert("test123");}()
produces SyntaxError: Unexpected token (
while
!function(){ alert("test123");}()
alerts "test123"
?
It's because by adding ! sign you convert the declaration into an expression and invoke it immediately.
By enclosing your function into brackets you will make first example working without errors:
(function(){ alert("test123");})()
To make it clearer you can think about first expression as something like:
if (false || !function(){ return false; }())
And as #zerkms noticed there is a complete explanation of Immediately-invoking functions.
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
What does the exclamation mark do before the function?
! preceding function in javascript?
javascript function leading bang ! syntax
I've been seeing this pattern a little bit recently in javascript:
!function () {
// do something
}()
what does the bang in front of the function keyword supposed to do? I can't seem to find anything about it on the intertubez.
function () {
// do something
}();
This is an immediately invoked function declaration. A function declaration can not be immediately invoked; it is a syntax error.
To get around this syntax error, most people enclose the IIFD in parens to force it to be an expression instead (IIFE).
(function () {
// do something
})();
In this case, they added an exclamation point instead.