5

I'm about to start building a small javascript module for an app. I've been exposed to two different ways of organizing code: the object literal and the IIFE. I know that with the IIFE, all variables and functions remain private unless otherwise made public, but are there any other reasons why I would use that over the object literal?

Why would I use the object literal:

var gojiraSays = 'Toxic Garbage Island!!!'

var app = {

  printStuff: function(){
    console.log(gojiraSays)
  }

}

...over say the IIFE version:

var app = (function(){
  var gojiraSays = 'Toxic Garbage Island!!!'

  var yellGojira = function(){
    console.log(gojiraSays);
  }

  return{
    yellGojira: yellGojira
  }

}());

app.yellGojira();
Modermo
  • 1,852
  • 2
  • 25
  • 46
  • 2
    This depends on too many different things. For example, if you intend for your module to be used with something like WebPack, the IIFE is completely redundant. – Marty Feb 14 '17 at 05:30
  • 1
    After the edit, yes, the advantage of wrapping in an IIFE is encapsulation (nothing else can mess with your `gojiraSays`). There's IIFE in other contexts (not as contrast to object literals), e.g. inside `for` or `while` loops to capture the value of local variables instead the variables themselves for async callbacks ([here](http://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example)). – Amadan Feb 14 '17 at 05:34
  • 1
    these are two different things. IIFEs deal with encapsulation of (private) variables whereas Objects provide structure to combine/group things that belong together. IIFEs don't provide structure, and Objects don't provide encapsulation. Your question is like asking, wich to prefer: functions or variables? You'll need both, and you'll probably combine them. – Thomas Feb 14 '17 at 06:01

2 Answers2

2

Module Pattern

Refer this answer to gain knowledge about advantages of using Object literal along with Revealing Module Pattern (RMP).

IIFE

Refer this link to get information about advantages of using IIFE's for project structuring.

My Suggestion

I will prefer using RMP as it enables you to efficiently separate concerns and will improve the readability at the same time.

Community
  • 1
  • 1
faizal vasaya
  • 517
  • 3
  • 12
  • I'm confused by this answer. The stupidly-named "revealing module pattern" **uses** IIFEs, so how can you treat the two as somehow being alternatives? –  Feb 19 '17 at 16:40
  • This will help you answer your doubt http://stackoverflow.com/questions/22906662/javascript-design-pattern-difference-between-module-pattern-and-revealing-modul – faizal vasaya Feb 20 '17 at 04:13
1

You should learn a third, better way of organizing modules, which is ES6 modules, which makes all this irrelevant.

// app.js
const gojiraSays = 'Toxic Garbage Island!!!'

export function printStuff() {
  console.log(gojiraSays)
}

// consumer.js
import {printStuff} from './app';

printStuff();

You will need a bit of infrastructure, such as a Babel transpilation step, to make this work.