标签：es6 导出 JS 括号 export user 命名 import js

在使用import语法引用模块时，如何正确使用{}

例如：有两个文件，home.js、user.js

当需要在home.js中引入user.js的时候

 

//home.js

import user from './user';

对于上面的这种引入方法，只有user.js文件中需要提供默认的export defulat进行导出（必须是默认导出）这样在home.js文件中就可以使用user了。如下

 

//user.js

export default 'nihao'

在这种不使用{}来引用模块的情况下，import模块时的命名是随意的，即如下三种引用命名都是正确的：

 

// home.js

import user from './user'

import user2 from './user'

import anyUser from './user'

因为它总是会解析到user.js中默认的export default。

 

而下面是使用了花括号命名的方法{user}来导入user.js：

 

import { user } from './user'

上面代码生效的前提是，只有在模块user.js中有如下命名导出为user的export 的代码，也就是：

 

//user.js

export const user = 42

而且，在明确声明了命名导出后，那么在另一个js中使用{}引用模块时，import时的模块命名是有意义的，如下：

 

// home.js

import { user } from './user'           // 正确，因为user.js中有命名为user的export

import { user2 } from './user'          // 错误！因为user.js中没有命名为user2的export

import { anyUser } from './user'        // 错误！因为user.js中没有命名为anyUser的export

要想上述代码正确执行，你需要明确声明每一个命名导出：

 

一个模块中只能有一个默认导出export default，但是却可以有任意命名导出（0个、1个、多个），你也可以如下，一次性将他们导入：

// user.js

import user, { user2, anyUser } from './user'

这里我们使用导入默认导出user，以及命名导出user2和anyUser。

 

标签：es6,导出,JS,括号,export,user,命名,import,js
来源： https://www.cnblogs.com/gtea/p/15832145.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。