我正在try 确定这两者之间是否有任何大的区别,除了能够通过以下方式导入export default个:

import myItem from 'myItem';

export const我可以做到:

import { myItem } from 'myItem';

除此之外,是否存在任何差异和/或用例?

推荐答案

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

要强调的是:这里重要的是export关键字,因为const用于声明一个或多个常量声明.export还可以应用于其他声明,例如类或函数声明.

Default Export (100)

每个文件可以有一个默认导出.导入时,必须指定名称并导入,如下所示:

import MyDefaultExport from "./MyFileWithADefaultExport";

你可以给它起任何你喜欢的名字.

Named Export (100)

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

// 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";

Namespace Import

还可以从对象上的文件导入所有内容:

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

Notes

  • 语法更倾向于默认导出,因为它们的用例更常见(See the discussion here).
  • 默认导出实际上是名为default的命名导出,因此您可以使用命名导入进行导入:

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

Javascript相关问答推荐

类型错误:tasks.map不是函数(MERN堆栈)

使用Apps Script缩短谷歌表中的URL?

橡皮擦完全让画布变成白色

添加/删除时React图像上传重新渲染上传的图像

我的glb文件没有加载到我的three.js文件中

如何在JavaScript中在文本内容中添加新行

如何最好地从TypScript中的enum获取值

如何才能拥有在jQuery终端中执行命令的链接?

在React中获取数据后,如何避免不必要的组件闪现1秒?

如何解决chrome—extension代码中的错误,它会实时覆盖google—meet的面部图像?'

InDesign—创建一个独立的窗口,在文档中进行更正时保持打开状态

如何使用JavaScript将文本插入空div

更改JSON中使用AJAX返回的图像的路径

获取Uint8ClampedArray中像素数组的宽度/高度

Javascript json定制

可更改语言的搜索栏

使用Ace编辑器对子组件实例的native-element 进行Angular 获取时面临的问题

无法检索与Puppeteer的蒸汽游戏的Bundle 包价格

Reaction useState和useLoaderData的组合使用引发无限循环错误

是否设置以JavaScript为背景的画布元素?