javascript unique(?) function writing

Question

a lot of times i can see function written like this :

name : function(){ ... }

i got several function about this :

what is this function different from normal(?) functions
what this kind of function calling like?

i couldn't find any information about this kind of function , tutorial will help.

possible duplicate of [What is the difference between a function expression vs declaration in Javascript?](http://stackoverflow.com/questions/1013385/what-is-the-difference-between-a-function-expression-vs-declaration-in-javascript) — Quentin, Oct 13 '11 at 20:47

score 3 · Accepted Answer · answered Oct 13 '11 at 20:47

3

A function in the format:

name: function() { ... }

Is a function within an object literal.

obj = {
  myfunction: function() { ... }
}

Which can be accessed by obj.myfunction();

answered Oct 13 '11 at 20:47

Gazler

83,029
18
279
245

is "myfunction: function(){}" the same thing as "myfunction = function(){}"? – Oct 13 '11 at 20:50
that's a great answer , I'll flag as answered when i be able to , thanks. – homerun Oct 13 '11 at 20:50
@Michael no. Using an = for assignment inside an object literal will result in a syntax error. – Gazler Oct 13 '11 at 20:50

score 1 · Answer 2 · answered Oct 13 '11 at 20:46

It's called an anonymous function.

It's different than a normal function because:

It's not global
It has access to variables in the outer scope

Calling one is just like normal:

var a = function(input) {
    alert(input);
};
a();

Or just..

function(input) {
    alert(input);
}();

And access the outer scope:

var output = "something";
function() {
    alert(output);
}();

They're frequently used as callbacks, where you pass one function to another, and that function calls your function. For example, here's some code to wait 1 second and then pop up with "Done waiting!":

setTimeout(function() {
    alert("Done waiting!");
}, 1000);

score 1 · Answer 3 · answered Oct 13 '11 at 20:48

1

There is some code missing. It should look like this:

var myobject = {name : function(){ ... }};

It's part of an object. In this case it belongs to the object myobject.
To call this function you have to write myobject.name()

answered Oct 13 '11 at 20:48

styrr

829
4
9

score 1 · Answer 4 · answered Oct 13 '11 at 20:48

These are called "function expressions" when defined like this, the "this" property inside the function points the the object this function is defined against (ie. the object holding "name" property).

doing something like

function name () {...}

Is called a function declaration and the "this" property points to the global object.

score 0 · Answer 5 · answered Oct 13 '11 at 20:48

That's a function just as normal as any. The only difference is that it is stored somewhere, probably in a regular old object.

You can make objects in JavaScript:

var blah = {}; // empty

Or maybe like this, storing key/value pairs:

var point = {x: 5, y: 22};

Then you can do:

point.x; // is 5!

An easier-to-look-at way of writing the same thing is:

var point = {
  x: 5,
  y: 22
};

There you can very clearly see that x is "mapped" to 5 and y is "mapped" to 22.

In this case, instead of making the value "5" or "22", the value is a function

var point = {
  x: 5,
  y: 22,
  functionName: function() { ... }
};

Then you can use that object like this:

point.x; // is 5!
point.functionName(); // calls the function!

A lot of times in JavaScript you will see basically this:

var LibraryOfFunctions = {
  functionA: function() { ... },
  functionB: function() { ... },
  functionC: function() { ... },
};

score 0 · Answer 6 · answered Oct 13 '11 at 20:49

a function without a name in the front is an anonymous function. You can assign an anonymous function to a variable:

 var myfunc = function {alert('hi')};

then call it like:

 myfunc();

Or it can be defined as part of a hash:

 var myhash = {}  // empty hash
 var myhash = {my_int: 5} //hash with a key and int value
 var myhash = {myfunc: function() {alert('hi');}}  //hash with key and function as a value

Now you can all it like:

myhash.myfunc()

You see this usage alot in jQuery configurations where a list of options is passed as a hash, some of them with anonymous functions.

javascript unique(?) function writing

6 Answers6