ES6的模块化（export导出）

 ES6 Module把一个文件当作一个模块，每个模块有自己的独立作用域，那如何把每个模块联系起来呢？核心点就是模块的导入（import）与导出（export）。

模块化的好处：

• 防止命名冲突
• 代码复用
• 高维护性

暴露也就是导出（export）有三种方式：1.分别暴露 2.统一暴露 3.默认暴露

分别暴露：在需要暴露的变量或者方法前面加上export关键字，我们新建一个m1.js文件写上如下代码

 1 //分别暴露
 2 export let team='RNG'
 3 
 4 export function play(){
 5     console.log('this is a team of LPL')
 6 }
 7 
 8 function own(){
 9     console.log('不想被暴露');
10 }

这个时候再在页面上对这个文件进行引入，同样新建一个页面 main.html，通过import关键字进行引入

1     

同理书写统一暴露m2.js代码如下：

 1 // 统一暴露
 2 let name = 'IG'
 3 function discription() {
 4     console.log('we are the champion');
 5 }
 6 
 7 //以对象的形式进行暴露
 8 export {
 9     name,
10     // 并且可以通过as取一个别名
11     discription as dis
12 }

引入m2.js的方法不变

1     

最后默认暴露（暴露一个default对象）

1 // 默认暴露
2 export default {
3     name: 'EDG',
4     say() {
5         console.log('it is a good team');
6     }
7 }

1