使用命名空间将代码从ES5迁移到ES2015

Question

We have a cross-platform application based on Polymer and Chromium .

Currently all our JavaScript dependencies are maintained in index.html by importing them in the right order! This approach will be a nightmare soon and writing test and to see the test coverage isn't a easy task.

To be future save we decided to jump on ES2015 with it's modularity approach.

Now we need to redesign our JavaScript files to be able to maintain the dependencies between single JavaScript modules. So far so good. But how do we do that to preserve our namespaces, closures etc.?

This is a sample code:

//namespace check
var app_ns = app_ns || { };

// ****************************************************************************
// Module: app
// ****************************************************************************

app_ns.app = (function initialize () {

  // ***
  // basic APIs and definitions
  // ***

  // Application version will be replaced by Gruntfile task.
  // Don't change the version manually!!!
  var AW_VERSION = "1.4.32";

  function version () { return AW_VERSION; }
  ...

  // ***
  // exports
  // ***
  return {
    version : version
  };  
}());

As you can see from the code above the initialization is executed and assigned to app_ns.app . Due to simplicity, the code snippet doesn't show dependencies to other modules but we have those for sure!

So the questions are

• How to use namespaces in ES2015
• How to automatically execute closures
• How to export functions of the modules but not in the global scope!

Using export { xxx }; is exporting all functions inside {...} in the global scope, right? How to bind the exported functions to the correct namespace ? In this example to app_ns.app

Answer 1

"Using export { xxx }; is exporting all functions inside {...} in the global scope, right?" Is not quite correct. It exports it to the scope that imports it. Right now browsers do not have a way of handling modules natively so most bundlers convert it CommonJs standard and scope it so it doesn't clobber global. I would reevaluate if name spaces are needed under the module paradigm.