ES6模块化

1、什么是模块化？

模块化是指将一个大的程序文件，拆分成许多个小的文件，然后将小文件组合起来。

2、模块化的好处：

（1）防止命名冲突

（2）代码复用

（3）高维护性

3、模块化语法：

模块功能主要有两个命令构成：export和import

export命令用于规定模块的对外接口

import命令用于输入其他模块提供的功能

4、举例：

1、使用export命令导出模块：

方式一、(分别暴露)

//m1.js
export let name="hbm"   //导出name变量
export function work(){   //也可以导出一个函数
   console.log('程序媛!')
}

方式二、（统一暴露）

//m2.js
 let name="hbm"   //导出name变量
 function work(){   //也可以导出一个函数
   console.log('程序媛!')
}
export {name,work};  //使用对象的简化写法统一暴露

方式三：默认暴露

//m3.js
 export default name="hbm"  

2、使用imprt导入模块：

方式一：通用方式,如

import  * as  m1 from 'm1.js'  //* 是指将m1文件中所有暴露的数据都存到m1模块中
                               //as 是给这个模块起别名，此处为m1

方式二：解构赋值的形式，如:

import {name,work} from 'm1.js' 

//如果存在同名，我们可以通过通过as 给模块起别名，避免命名冲突

如：imprt {name as hbmya,work} from 'm2.js' 

方式三：简便形式，仅针对默认暴露,如：

import  m3 from 'm3.js'

5、更多资料可参考

ES6 入门教程

https://es6.ruanyifeng.com/#docs/module

6、后记：

如有错误，麻烦大家帮忙指出！如果有帮助到您，那真是太棒啦！