我个人使用import，因为我们可以通过import导入所需的方法和成员。

import {foo, bar} from "dep";

文件名:dep.js

export foo function(){};
export const bar = 22

这要归功于单霁翔。更多信息。

使用ES6模块可以用于“摇树”;例如，启用Webpack 2、Rollup(或其他捆绑程序)来识别未使用/导入的代码路径，因此不会将其放入最终的捆绑程序中。这可以通过消除你永远不需要的代码来显著减少它的文件大小，但是默认情况下与CommonJS绑定，因为Webpack等人无法知道是否需要它。

这是使用代码路径的静态分析来完成的。

例如，使用:

import { somePart } 'of/a/package';

．.． 给捆扎者一个包装的暗示。anotherPart不是必需的(如果它没有被导入，它就不能被使用——对吧?)，所以它不会费心捆绑它。

为了在Webpack 2中启用这个功能，你需要确保你的编译器不会吐出CommonJS模块。如果你正在使用带有babel的es2015插件，你可以像这样在.babelrc中禁用它:

{
  "presets": [
    ["es2015", { modules: false }],
  ]
}

Rollup和其他工具的工作方式可能不同——如果您感兴趣，请查看文档。

当涉及到异步或延迟加载时，import()要强大得多。当我们以异步方式需要该组件时，我们会以某种异步方式使用import，例如在const变量中使用await。

const module = await import('./module.js');

或者如果你想使用require()，

const converter = require('./converter');

import()实际上在本质上是异步的。正如neehar venugopal在ReactConf中提到的，你可以使用它来动态加载客户端架构的react组件。

此外，当涉及到路由时，它是更好的方式。这是使网络日志在用户连接到特定网站时下载到其特定组件的一个特殊之处。例如，在仪表板之前的登录页面不会下载仪表板的所有组件。因为什么是需要当前即登录组件，这只会下载。

导出也一样:ES6的导出与CommonJS module.exports完全相同。

注:如果你正在开发一个node.js项目，那么你必须严格使用require()，因为如果你将使用import，节点将抛出异常错误作为无效的令牌'import'。所以node不支持import语句。

更新-根据Dan Dascalescu的建议:自v8.5.0(2017年9月发布)以来，node -experimental-modules索引。mjs让你不用Babel就可以使用import。你也可以(也应该)将你的npm包作为原生ESModule发布，并向后兼容旧的require方式。

在哪里使用异步导入，请参见https://www.youtube.com/watch?v=bb6RCrDaxhw

更新

自Node v12(2019年4月)以来，默认启用了对ES模块的支持，自Node v15(2020年10月)以来，它是稳定的(见这里)。包含节点模块的文件必须以.mjs或最近的包结尾。Json文件必须包含“type”:“module”。Node文档有更多的信息，还有关于CommonJS和ES模块之间的互操作。

在性能方面，新特性总是有可能没有现有特性优化得那么好。但是，由于模块文件只计算一次，所以性能方面可能会被忽略。最后，您必须运行基准测试以获得明确的答案。

ES模块可以通过import()函数动态加载。与require不同，this返回一个promise。

以前的回答

使用其中一种是否有性能上的好处?

请记住，目前还没有原生支持ES6模块的JavaScript引擎。你自己说过你在使用通天塔。无论如何，Babel默认将导入和导出声明转换为CommonJS (require/module.exports)。因此，即使你使用ES6模块语法，如果你在Node中运行代码，你将在底层使用CommonJS。

CommonJS和ES6模块之间有一些技术上的差异，例如CommonJS允许你动态加载模块。ES6不允许这样做，但有一个正在开发的API。

因为ES6模块是标准的一部分，所以我会使用它们。

我个人使用import，因为我们可以通过import导入所需的方法和成员。

import {foo, bar} from "dep";

文件名:dep.js

export foo function(){};
export const bar = 22

这要归功于单霁翔。更多信息。

到目前为止，ES6的导入和导出总是编译为CommonJS，所以使用其中一个没有好处。尽管推荐使用ES6，因为当浏览器发布本机支持时，它应该是有利的。原因是，你可以从一个文件中导入部分，而使用CommonJS，你必须需要整个文件。

ES6→导入，导出默认，导出

CommonJS→require, module。出口,exports.foo

下面是它们的常用用法。

ES6导出默认值

// hello.js
function hello() {
  return 'hello'
}
export default hello

// app.js
import hello from './hello'
hello() // returns hello

ES6导出多个和导入多个

// hello.js
function hello1() {
  return 'hello1'
}
function hello2() {
  return 'hello2'
}
export { hello1, hello2 }

// app.js
import { hello1, hello2 } from './hello'
hello1()  // returns hello1
hello2()  // returns hello2

CommonJS module.exports

// hello.js
function hello() {
  return 'hello'
}
module.exports = hello

// app.js
const hello = require('./hello')
hello()   // returns hello

CommonJS模块。出口多

// hello.js
function hello1() {
  return 'hello1'
}
function hello2() {
  return 'hello2'
}
module.exports = {
  hello1,
  hello2
}

// app.js
const hello = require('./hello')
hello.hello1()   // returns hello1
hello.hello2()   // returns hello2