模块化的特点:
1.以功能划分为多个文件
2.随意组合,随意拆分,易于理解,易于扩展,易于维护,易于复用
模块化的语法分为导出和导入两部分
使用 CommonJS
导出
默认导出
module.exports = { 导出的数据 }
按需导出
module.exports.键 = 导出的数据 可以重新赋值(覆盖)
exports.键 = 导出的数据 不能重新赋值
导入
默认导入
const 自定义模块名称 = require('指定模块路径或者模块名称')
按需导入 数据名称要和导出的数据名称相同
const { 数据1,数据2} = require(" 指定模块路径或者模块名称 ")
使用 ES Module
导出:
// 默认导出 只能导出一次
export default 要导出的对象// 按需导出 可以导出多次 最终导出一个对象 可以先导出再创建
export { 要导出的数据 }
导入
// 默认导入
import 自定义模块名 from '模块名或者路径'// 按需导入 数据名要和导出的名字相同
import {数据 , 数据 ...} from '模块名或者路径'// 混合导入
import 模块名,{数据 , 数据 ...} from '模块名或者路径'
node环境下默认不支持ES Module的语法
解决方法:
1.把文件名改为 .mjs
2.浏览器使用时在html页面引入链接的里面加 type="module" 使用live server插件打开