JavaScript function different syntax?

Question

Possible Duplicate: What is the difference between a function expression vs declaration in JavaScript? This JavaScript syntax I haven't seen till now, what does it do really?

What is the difference between the following two ways of writing a function? I've seen both used, but I'm not sure which one is 'correct'.

function init() {

}


init: function() {

},

And what are the advantages to writing it the second way?

Besides. The second one is not even syntactically valid in this context. — Tomalak, Feb 06 '12 at 21:29
@Tomalak: No, the object literal function syntax is not discussed in your linked question. Not a duplicate at all. — Platinum Azure, Feb 06 '12 at 21:32
@Platinum: The second one is a function expression. The (here missing) object literal does not make it anything else. — Tomalak, Feb 06 '12 at 21:38

Paul · Accepted Answer · 2012-02-06T21:40:48.203

Function declaration

function init() {

}

Function expression

var init = function() {

};

The primary differences have to do with Variable Hoisting in JavaScript. You can read more here: http://www.adequatelygood.com/2010/2/JavaScript-Scoping-and-Hoisting and http://javascriptweblog.wordpress.com/2010/07/06/function-declarations-vs-function-expressions/

By your example, I believe you are also interested in defining anonymous functions in object literals. Here is an example:

//obj is the object name
var obj = {
    //init is the property name or key and the anonymous function is the value
    init: function() {
    },
    anotherProp: 'some value'
};

This would be used like so:

obj.init();
alert(obj.anotherPorp);

In object literals different properties of the object are defined with a key: value syntax and use commas to separate them.

I would recommend going through this free series on JavaScript http://learn.appendto.com/lessons, it will answer a lot of these questions for you and give you a solid base to becoming a JS developer.

score 0 · Answer 2 · edited Apr 12 '15 at 00:02

Try to always use:

init: function (){

}

when writing an object literal.

When you're trying to process a global function set it as a var instead, so:

var init = function(){

}

Remember, each has its place, but I've personally become fond of writing a namespace for the project I'm working on and using an object literal.

Now both of these will only be available in the object as soon as the object is set. The other method is a little sloppier and less used now, but can be called no matter the order of operations, so it can be called before or after it's set in the code... Again, this is being abandoned in a lot of cases.

function init(){

}

score 0 · Answer 3 · answered Feb 06 '12 at 21:31

The second one can only be used in the context of an object literal:

var myNamespace = {
    func1: function () {
        // do something
    },

    func2: function () {
        // do something else
    },

    someValue = 5
};

The first form is executed as a statement. It is equivalent to:

var init = function () {
    // do something
};

score 0 · Answer 4 · edited Jan 08 '14 at 11:43

The first example defines a function in the global scope which can be called with init(). The second defines a property of an object called init that is the function declaration to the right.

Generally, the second example provides a smaller scope in which you could execute the function.

First example allows you to call the function like so:

init();

And the second, more likely this:

var thing = function() {
    init: function() { }
};

thing.init();

JavaScript function different syntax?

4 Answers4