如何正确使用立即调用函数表达式（IIFE）声明类？

Question

I understand there are many different ways to declare an IIFE:
( http://benalman.com/news/2010/11/immediately-invoked-function-expression/ )

But what I can't understand is how sometimes many classes are defined within the same IIFE, and other times they are separated in each their own.

Example:

This...

(function(scope) {
  var ClassA = scope.ClassA = function(params) {
    this.params = params;
  }

  var ClassB = scope.ClassB = function(params) {
    this.params = params;
  }
})(someNamespace || window);

VS. That...

(function(scope) {
    var ClassA = scope.ClassA = function(params) {
        this.params = params;
    }
})(someNamespace || window);

(function(scope) {
    var ClassB = scope.ClassB = function(params) {
        this.params = params;
    }
})(someNamespace || window);

Are there any advantages to isolate each classes into their own IIFE?

Answer 1

The point of using an IIFE is to stop variables used by one piece of code leaking into places where they might get mixed up with identically named variables used by another piece of code.

If the two functions should share variables, then putting them in the same IIFE is a good idea. If not, then they should be kept separate to avoid naming collisions and to show to the maintainer that they are separate.

Answer 2

There are slight performance advantages to sharing the IIFE. I put your two examples into jsperf and compared them, and the shared IIFE runs slightly faster....but the performance gains are totally negligible unless you are declaring many thousands of classes in this way.

http://jsperf.com/iife-performance-for-class

Here's a different test comparing IIFE performance in a slightly different manner: http://jsperf.com/iife-performance

I prefer to put each class in its own file so that it's easier to find each class during the editing process, which would result in each class getting its own IIFE.