模块化就是把单独的一个功能封装到一个模块(文件)中,模块之间相互隔离,但是可以通过特定的接口公开内部成员,也可以依赖别的模块(方便代码的重用,从而提升开发效率,并且方便后期的维护)
服务器端模块化规范
- CommonJS:
- 模块分为单文件模块与包
- 模块成员导出:module.exports和exports
- 模块成员导入:require('模块标识符‘)
ES6模块化的基本语法:
-
默认导出与导入:
-
默认导出语法:
export default 默认导出的成员
-
//当前文件模块m1.js //定义私有成员a和c let a = 10 let c= 20 //外界访问不到变量d,因为它没有被暴露出去 let d = 30 function show(){} //将本模块中的私有成员暴露出去,供其他模块使用 export default { a, c, show }
-
默认导入语法
import 接受名称 from '模块标识符'
-
//导入模块成员 import m1 from './m1.js' console.log(m1) //输出:{a:10, c:20, show: [Function: show]}
-
-
按需导出与按需导入
-
按需导出语法
export let s1 = 10
-
按需导入语法
import {s1} from '模块标识符'
-
//当前文件模块为m1.js //向外按需导出变量 export let s1 = 'aaa' export let s2 = 'ccc' export function say = function(){} //按需导入 import {s1,s2 as ss2, say} from './m1.js' //import m1,{s1,s2 as ss2, say} from './m1.js' //默认导出和按需导出可以一起导入,每个模块中可以使用多次按需导出,默认导出仅一次 console.log(s1) //aaa console.log(ss2) //ccc console.log(say) //[Function say]
-
-
直接导入并执行模块代码
有时候我们只想单纯执行某个模块中的代码,并不需要得到模块中向外暴露的成员,此时,可以直接导入并执行模块代码
-
//当前文件模块为m2.js for(let i = 0; i < 3; i++){ console.log(i) } //直接导入 import './m2.js'
-