我什么时候应该在 JavaScript / TypeScript 中使用“导出默认值”？

Question

如果我们指定默认导出：

export class Foo {}
export default Foo;

那么我们可以在导入期间省略花括号（如this answer 中所述）：

import { Foo } from "foo"; // becomes:
import Foo from "foo";

这很好，但是在特定情况下是否有任何非风格的理由偏爱其中一种？例如，是否存在某种约定，或者一种与某些工具不兼容，或者一种具有不同的含义？

（基于this discussion 和其他人，我的理解是export default 可能是作为处理单个主要对象（如$）导出的一种方式出现的，现在由import * as foo from "foo" 处理.此外，似乎默认导入语法不强制一致命名（import fooAlias from "foo"），而标准导入import { fooAlias } from "foo"将是编译错误，除非别名是明确的（Foo as fooAlias）。除此之外，我没有'找不到太多关于何时应该使用其中一个的信息。）

Answer 1

这里没有对错。我更喜欢导出一件事，所以大多数时候默认对我有用。您也可以同时使用两者。

在采用更纯粹的函数式方法或编写一组静态实用程序函数时，我倾向于不使用default。

所以当我的模块真的只是一个类时，我喜欢使用default。请注意，我仍然可以导出其他内容。

export default class Foo {
}

// 一些实用模块

export function fooHelper() {
}
export function bazHelper() {
}

Answer 2

导出默认值可以让您在导入时重命名文件...

foo.js

export default class Foo{
  constructor(){
  }
}

可以是另一个文件中的import Bar from './foo';，如果您正在使用库并且已经定义了类 Foo，这可能会很有用。

您还可以导出默认值和非默认值，这样： import Foo, { someVariable, someMethod } from './foo';