ES6中的export const与export default的比较

Question

我正在尝试确定这两者之间是否有较大区别，而不是export default仅通过以下操作即可导入：

import myItem from 'myItem';

使用export const我可以做到：

import { myItem } from 'myItem';

我想知道除此以外是否还有其他差异和/或用例。

Answer 1

这是命名导出与默认导出。export const是导出一个或多个const声明的命名导出。

要强调的是：这里重要的是用于声明一个或多个const声明的export关键字const。export也可以应用于其他声明，例如类或函数声明。

默认导出（export default）

每个文件可以有一个默认导出。导入时，您必须指定一个名称并像这样进行导入：

import MyDefaultExport from "./MyFileWithADefaultExport";

您可以给它取任何您喜欢的名字。

命名为出口（export）

使用命名导出，每个文件可以有多个命名导出。然后导入要用大括号括起来的特定导出：

// ex. importing multiple exports:
import { MyClass, MyOtherClass } from "./MyClass";
// ex. giving a named import a different name by using "as":
import { MyClass2 as MyClass2Alias } from "./MyClass2";

// use MyClass, MyOtherClass, and MyClass2Alias here

也可以在同一条语句中使用默认值和命名导入：

import MyDefaultExport, { MyClass, MyOtherClass} from "./MyClass";

命名空间导入

也可以从对象上的文件中导入所有内容：

import * as MyClasses from "./MyClass";
// use MyClasses.MyClass, MyClasses.MyOtherClass and MyClasses.default here

笔记

• 语法更倾向于默认导出，因为它的用例更常见，因为它更简洁。
• 默认导出实际上是具有名称的命名导出，default因此您可以使用命名导入来导入它：

  import { default as MyDefaultExport } from "./MyFileWithADefaultExport";