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、后记:
如有错误,麻烦大家帮忙指出!如果有帮助到您,那真是太棒啦!