一些差异可能会让您选择其中之一：

命名出口

• 可以导出多个值
• 导入时必须使用导出的名称

默认导出

• 导出单个值
• 导入时可以使用任何名称

这篇文章很好地解释了何时使用一个而不是另一个是个好主意。

这有点见仁见智，但也有一些客观的方面：

• 一个module中只能有一个默认导出，而您可以拥有任意数量的命名导出。

• 如果您提供默认导出，则使用它的程序员必须为其命名。这可能会导致代码库中的不一致，而 Mary 所做的

  import foo from "./foo";
  

  ......但乔做到了

  import getFoo from "./foo";
  

  相反，对于命名导出，除非与module中的另一个标识符发生冲突，否则程序员不必考虑如何调用它。只是

  import { foo } from "./foo";
  

  ...（as getFoo如果有必要使用一个以避免冲突）。

• 对于命名导出，导入它的人必须指定他们正在导入的名称，这意味着如果他们尝试导入不存在的东西，他们会得到一个很好的早期错误。

• 如果您始终只使用命名导出，那么从项目中的module导入的程序员不必考虑他们想要的是默认导出还是命名导出。

使用命名导出，一个文件可以有多个命名导出。然后导入他们想要用大括号括起来的特定导出。导入module的名称必须与导出module的名称相同。

// imports
// ex. importing a single named export
import { MyComponent } from "./MyComponent";

// ex. importing multiple named exports
import { MyComponent, MyComponent2 } from "./MyComponent";

// ex. giving a named import a different name by using "as":
import { MyComponent2 as MyNewComponent } from "./MyComponent";

// exports from ./MyComponent.js file
export const MyComponent = () => {}
export const MyComponent2 = () => {}

您还可以为命名导入设置别名，在导入时为命名导出指定一个新名称，允许您解决命名冲突，或者为导出提供一个更具信息性的名称。

import MyComponent as MainComponent from "./MyComponent";

您还可以将所有命名的导出导入到一个对象中：

import * as MainComponents from "./MyComponent";
// use MainComponents.MyComponent and MainComponents.MyComponent2 here

每个文件只能有一个默认导出。当我们导入时，我们必须指定一个名称并导入如下：

// import

import MyDefaultComponent from "./MyDefaultExport";

// export

const MyComponent = () => {}

export default MyComponent;

导入的命名在默认导出中是完全独立的，我们可以使用任何我们喜欢的名称。

来自MDN： 命名导出对于导出多个值很有用。在导入过程中，可以使用相同的名称来引用相应的值。关于默认导出，每个module只有一个默认导出。默认导出可以是函数、类、对象或其他任何东西。该值将被视为“主要”导出值，因为它是最容易导入的。

没有任何明确的规则，但人们使用一些约定来简化代码的结构或共享。

当整个文件中只有一个导出时，没有理由让它命名。此外，当您的module有一个主要用途时，将其设为默认导出是有意义的。在这些情况下，您可以额外命名导出

例如，在 react 中，React是默认导出，因为这通常是您唯一需要的部分。你并不总是Component，所以这是一个命名的导出，你可以在需要时导入。

import React, {Component} from 'react';

在其他情况下，一个module有多个相等（或几乎相等）的导出，最好使用命名导出

import { blue, red, green } from 'colors';

第一种方法：-

export foo; //so that this can be used in other file

import {foo} from 'abc'; //importing data/fun from module

第二种方法：-

export default foo;  //used in one file

import foo from 'blah'; //importing data/fun from module

第三种方法：-

export = foo;

import * as foo from 'blah';

上述方法大致编译为以下语法：-

//所有导出方法

exports.foo = foo; //1st method
exports['default'] = foo; //2nd method
module.exports = foo; //3rd method

//所有导入方法

var foo = require('abc').foo; //1st method
var foo = require('abc')['default']; //2nd method
var foo = require('abc'); //3rd method

有关更多信息，请访问默认关键字解释

注意：- 只能在文件中one导出。defaultone

所以每当我们只导出 1 个函数时，最好default在导出时使用关键字