ES6的导出和花括号

Question

我在聊天频道中看到了一段代码。他的代码最后一行是：

export {UserInformation};

有一些团体认为语法是错的，还有一些则表示只要变量存在就行了，语法没问题。

那么哪个团队是正确的呢？这也是我第一次见到这种语法。在 export 中使用花括号我以前从未见过，只有在 import 中用过，就像这样：

import {method} from 'someModule';

如果我要写这段话，我会写成：

export default UserInformation;

我不想用错误的信息污染我的大脑。请告诉我哪个导出是正确的。

- devwannabe

---

为什么不试一下呢？或者，作为另一种选择，您可以阅读 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export 上的文档。给出的第一个示例是 export { name1, name2, …, nameN };。 - user663031

Answer 1

语法正确。这个

export {UserInformation};

是...的简写

export {UserInformation as UserInformation};

就像做

export const UserInformation = {};

当你定义 UserInformation 时，能够在其它地方将模块中的内容导出（例如为了可读性）非常有用。

在这种情况下，你可以像这样导入 UserInformation：

import {UserInformation} from 'UserInformation.js';

请注意，export default UserInformation; 并不等同于这个。在那种情况下，你会将 UserInformation 设置为默认的模块导出。要在这种情况下导入 UserInformation，你需要执行以下操作：

请注意，export default UserInformation;是不等同于这个。在这种情况下，您正在使UserInformation成为默认的模块导出项。要在此情况下导入UserInformation，您需要执行以下操作：

import UserInformation from 'UserInformation.js';

这是“...的简写”。

import {default as UserInformation} from 'UserInformation.js';

这篇博客文章是关于这个主题的优秀阅读材料。

- Esteban

---

你提供的 import UserInformation from 'UserInformation.js'; 的示例是错误的，应该改为 import {UserInformation} from 'UserInformation.js';。第二个导入默认值的示例是正确的，但通常会写成 import UserInformation from 'UserInformation.js';。 - user663031

@torazaburo，谢谢您指出这一点，我刚刚更新了答案。楼主请注意torazaburo的评论和答案的更新，之前有一个大错误。 - Esteban

再次感谢您！:) - devwannabe