ES2015 导出内部函数答案

【问题标题】：ES2015 Export inside functionES2015 导出内部函数
【发布时间】：2016-01-03 13:38:49
【问题描述】：

我正在学习 ES2015 的导出功能。我尝试在网上理解它，但我的疑问仍然没有解决

当我在匿名函数中声明导出时，jshint 显示以下错误（至少在 Intellij 插件中）：

E053 出口申报必须在全球范围内。

相反，JSHint 总是要求将整个代码包装在 Anonymous 函数中。如果我按以下方式编写代码：

export const MY_CONSTANT = 1000;
(function(){
   'use strict';
    //Complete code goes here
}();

我们必须在页面的顶部和底部编写大量代码。一些代码会从文件之间跳转到页面的开头（或结尾）。

【问题讨论】：

标签： javascript export ecmascript-6

【解决方案1】：

我能解释它的最好方法是 javascript IIFE 是创建封装的方法。您可以将模块的代码放在其中一个并返回某种类型的对象。如果您需要将代码导入其中，您可以使用参数来执行此操作。新的模块语法允许您以不同的方式执行相同的操作。将导入视为 IIFE 的参数，将导出视为返回。这是来自Mozilla https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import的导入导出语法的完整解释

如果你想进一步探索，我创建了一些样板文件，使用 babel、gulp、browserify 和 jasmine，因此我可以将我所有的代码编写为 es2015。 https://github.com/jamesrhaley/es2015-babel-gulp-jasmine.git

【讨论】：

【解决方案2】：

如果您使用 ES2015 模块语法，您可能不需要将代码包装在匿名函数中，因为模块加载器会处理导出的代码。

我不确定每个模块加载器，但是当使用 TypeScript + browserify 时，每个文件都会被包装以防止变量混淆全局命名空间。有关如何使用模块语法以及为什么可以全局声明变量的更多信息，请参阅Why must export import declarations be on top level in es2015。

【讨论】：