javascript - 带有命名空间的从 ES5 到 ES2015 的代码迁移

Question

我们有一个基于 Polymer 的跨平台应用程序和 Chromium .

目前，我们所有的 JavaScript 依赖项都在 index.html 中维护。通过在 中导入它们右 命令!这种方法很快就会成为一场噩梦，编写测试并查看测试覆盖率并不是一件容易的事。

为了将来保存，我们决定跳上 ES2015使用它的模块化方法。

现在我们需要重新设计我们的 JavaScript 文件，以便能够维护单个 JavaScript 模块之间的依赖关系。到现在为止还挺好。但是我们如何做到这一点来保留我们的命名空间、闭包等呢？

这是一个示例代码:

//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
  };  
}());

从上面的代码可以看出，初始化被执行并分配给 app_ns.app .由于简单，代码片段没有显示对其他模块的依赖，但我们肯定有这些!

所以问题是

ES2015中如何使用命名空间

如何自动执行闭包

如何导出模块的功能但不在全局范围内!

使用 export { xxx };正在导出 {...} 中的所有函数在全局范围内，对吗？如何将导出的函数绑定(bind)到正确的 命名空间 ?在本例中为 app_ns.app

Answer 1

“使用 export { xxx }; 是在全局范围内导出 {...} 内的所有函数，对吗？”不太正确。它将它导出到导入它的作用域。现在浏览器没有办法在本地处理模块，所以大多数捆绑器将它转换为 CommonJs 标准并确定它的范围，这样它就不会破坏全局。我会重新评估在模块范式下是否需要 namespace 。