Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Differences between types of Javascript function declarations

Tags:

javascript

While reading about IronJS, I can across the article here http://ironjs.wordpress.com/

In it is the following:

*Context sensitive function keyword

In case you didn’t know, these two functions are not identical:

(function bar() { })  

function foo() { } 

Finding out the difference I’ll leave as an exercise to the reader.

Can some explain the difference here?

like image 524
Gaz Avatar asked Jun 22 '11 20:06

Gaz


4 Answers

function foo() { }

Creates a function

(function foo(){ })

Returns a function object. You can also use:

(function foo(){ })(bar)

And make an anonymous function. (Note that the (bar) means that within that function this refers to the bar instance.)

Check out this other SO post for more information.

like image 129
Brad Christie Avatar answered Oct 17 '22 17:10

Brad Christie


I am guessing the difference is that the first one is not visible to the global scope and the latter is visible globally.

like image 35
Amir Raminfar Avatar answered Oct 17 '22 15:10

Amir Raminfar


To expand on @Amir's answer:

js>(function bar() {})(3)
js>bar
console:1       ReferenceError: bar is not defined
js>function foo() {}
js>foo
function foo() {
}

(code executed in jsdb)

These are named functions, and if you don't put parentheses around the function definition, they become part of the local scope. function foo() {} becomes available for use later, but bar does not.

As a third example:

var x = function baz() {};

If you run this:

js>var x = function baz() {}
js>baz
console:1       ReferenceError: baz is not defined

You'll note that it's the similar case as (function baz(){})(3).

The case of

function foo() {}

is special, the Javascript interpreter sees that form and says, "Oh, you're trying to define a function named "foo" in the local scope."

As for why a named function is useful even if it doesn't get defined in the local scope -- the named function is visible from the scope of the function itself:

js>var x = function fact(n) { return n*((n < 2) ? 1 : fact(n-1)); }
js>x(3)
6
js>fact
console:1       ReferenceError: fact is not defined

Here we have a factorial function named "fact", but the name "fact" is only visible inside the scope of the function itself.

like image 21
Jason S Avatar answered Oct 17 '22 17:10

Jason S


The first function is a named anonymous function (yeah). The expression evaluates to a Function. The second one defines a named function and returns undefined.

like image 30
Jakub Lédl Avatar answered Oct 17 '22 17:10

Jakub Lédl