Javascript return using colon

Question

When you see code like this:

var spa = (function () {
..
..


  return { initModule: initModule };
}());

Can someone explain the line return { initModule: initModule } ?

[It's a revealing module pattern](http://www.addyosmani.com/resources/essentialjsdesignpatterns/book/#revealingmodulepatternjavascript) (well, almost - your syntax is slightly wrong). You define the module in the function (including all 'private' methods and variables) and then return an object containing only those methods you want in the API. In this case there's only one method: `spa.initModule()`. — Andy, Sep 26 '14 at 10:23
What you've pasted is an IIFE, which returns an object and a few extra ")" and "}". — Matt, Sep 26 '14 at 10:23
If you didn't recognize [object initializer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects#Using_object_initializers) in the return value, you should start to learn some basics of JavaScript. — Teemu, Sep 26 '14 at 15:22

score 0 · Answer 1 · answered Sep 26 '14 at 10:33

It's a revealing module pattern (well, almost - your syntax is slightly wrong). You define the module in the function (including all 'private' methods and variables) and then return an object containing only those methods you want in the API. In this case there's only one method: spa.initModule().

It should look like:

var spa = (function () {

  function initModule() {
    //do something
  }

  return { initModule: initModule };

}());

spa is actually an object, not a function. The function is only returning the module API to spa. So you define initModule in the function but to return it you need to add it as a value in an object. Assuming you want the same method name on spa you use the key name initModule too.

You can see in the demo that in the second example I've used hallo as the object key name.

DEMO

score 0 · Answer 2 · edited Jun 20 '20 at 09:12

0

First

(function () {})(); is anoynomous function and will be executed when script is processed

{} is object literel in javascript

Overall

spa will contain an object reference to { initModule: initModule }

spa.intiModule will return its value whatever is set. if initModule is function reference then it will return reference to function and you have to call spa.intiModule() to execute it

edited Jun 20 '20 at 09:12

Community

1
1

answered Sep 26 '14 at 10:33

Voonic

4,667
3
27
58

score 0 · Accepted Answer · answered Sep 26 '14 at 10:36

It's a revealing module pattern. See the following syntax.

var spa = (function () {
..
..
  function initModule () {
      // Your code
   }

  function otherModule () {
      // Your code
   }

  return { initModule: initModule };
}());

Every variable function defined inside spa object will not be directly accessible. In module pattern if we return spa as a whole object, then we've to define which function/ variables will be returned.

So, our code for initModule will be

spa.initModule = function () {};

In revealing module pattern, we just return a single object which contains all the variables and functions available to user using spa object.

The return { initModule: initModule } line actually tells the spa object's function called initModule (defined 2nd time) is available outside this module. The first time initModule is called is the name by which it can be accessed.

This is equivalent to return { test: initModule }. Now you've to call spa.test() to execute initModule inside it.

Javascript return using colon

3 Answers3