文件:SafeString.js

// Build out our basic SafeString type
function SafeString(string) {
  this.string = string;
}

SafeString.prototype.toString = function() {
  return "" + this.string;
};

export default SafeString;

我以前从未见过导出默认。对于出口默认值,有什么更容易理解的等效内容吗?


当前回答

导出默认函数(){}可以在函数没有名称时使用。一个文件中只能有一个默认导出。另一种方法是命名导出。

本页详细介绍了导出默认值以及我发现非常有用的模块的其他详细信息。

其他回答

在我看来,默认导出的重要之处在于它可以用任何名称导入!

如果有一个文件foo.js,它将导出默认值:

导出默认函数foo(){}

可以使用以下方法在bar.js中导入:

从“foo”导入栏import Bar from'foo'//或您希望分配给此导入的任何其他名称

导出默认函数(){}可以在函数没有名称时使用。一个文件中只能有一个默认导出。另一种方法是命名导出。

本页详细介绍了导出默认值以及我发现非常有用的模块的其他详细信息。

ES6中引入的一个好特性是javascript模块,它可以高效地在不同的.js文件之间导出和导入变量、函数和类。

我们有两种不同的导出方式:命名导出和默认导出。要正确理解默认导出,我们必须首先很好地理解命名导出。

命名导出

在本例中,在源文件中,我们导出具有特定名称的所需变量、函数或类。语法如下:

// file: source.js
export const myVariable = /* … */
export function myFunction() { /* … */ }
export class myClass { /* … */ }

现在,要访问目标文件中的上述项,必须按如下方式导入它们:

// file: target.js (in the same directory as the source.js file) 
import { myVariable } from "./source.js"
import { myFunction } from "./source.js"
import { myClass } from "./source.js"

现在是时候进入主要问题“默认导出到底是什么”了?

默认导出

除了按名称导出它们(命名为exports)的情况外,还有一个类似的功能,称为默认导出,在每个.js文件中只能使用一次。请参阅以下示例,并将其与之前的source.js文件进行比较:

// file: source.js
export default function myNewFunction() { /* … */ }
export const myVariable = /* … */
export function myFunction() { /* … */ }
export class myClass { /* … */ }

事实上,每个.js文件可以有“多个命名导出”和“只有一个默认导出”,其中myNewFunction作为默认导出。这样,在目标文件中导入时,javascript会了解默认导出的项目。

“导出为默认值”的项目(myNewFunction)将导入target.js文件,如下所示:

// file: target.js (in the same directory as the source.js file)
import anyName from "./source.js"

仔细看看这些区别!这里,我们在导入后没有{}号,我们使用了源文件中没有的自定义名称。这里anyName表示myNewFunction。

这表明,我们可以为导入时“导出为默认值”的项目指定“任何所需名称”,只要指向源文件的“路径”,JavaScript就会找到该文件并将其导入。

一些重要注意事项:

与命名导出不同,在默认导出中,我们不需要导出命名项目,我们也可以导出“未命名”项目。他们为什么要在ES6中添加默认导出功能!?对于能力导出“未命名项”(匿名函数和类)以及表达式,甚至对象文本。

它是ES6模块系统的一部分,如本文所述。该文档中还有一个有用的示例:

如果模块定义了默认导出://foo.js导出默认函数(){console.log(“hello!”)}然后可以通过省略大括号来导入默认导出:从“foo”导入foo;foo();//你好


更新:截至2015年6月,模块系统在§15.2中定义,尤其是导出语法在ECMAScript 2015规范的§15.2.3中定义。

ES6中有两种出口:

命名导出-例如,导出函数func(){}是一个名为func的命名导出。可以使用import{exportName}从“module”;导入命名模块;。在这种情况下,导入的名称应与导出的名称相同。要导入示例中的func,必须使用import{func}from'module';。一个模块中可以有多个命名导出。

默认导出-是将从模块导入的值,如果您使用简单的import语句import X from'module'。X是将在本地为指定包含该值的变量指定的名称,它不必像原始导出那样命名。只能有一个默认导出。

模块可以同时包含命名导出和默认导出,并且可以使用“module”;中的import defaultExport、{namedExport1、namedExport3等…}将它们一起导入;。