前端模块化-导入导出
1、CommonJs实现导入导出
导出:通过一个对象导出 module.exports = { flag : true, test(a,b){ return a + b; }, demo(a,b){ return a * b } } 导入 let {test,demo,flag} = require('moduleA') 等价于 let _ma = require('moduleA') let test = _ma.test
2、ES的导入导出
1)export的基本使用
export指令用于导出变量,函数或者是类
导出变量
var name = '小明' var age = 18 var flag = true //1、导出方式一: export { flag,age } //2、导出方式二 export var num1 = 1000; export var height = 1.88
导出函数和类
export function mul(num1,num2) { return num1 * num2 } export class Person { run(){ console.log("在快乐的奔跑...."); } }
2)export default的使用
某些情况下,一个模块中包含某个的功能,我们并不希望给这个功能命名,而且让导入者可以自己来命名
这个时候就可以使用export default
export default function(){ console.log("default function") } 使用 import myFun from './info.js' //myFun是自己对导出的函数取的名字 myFun()
【注意】 export在一个模块中,不能同时存在多个
3)import的使用
import指令用于导入模块中的内容
import {age,name,height} from "./info.js"
可以通过*导入一个模块中所有导出的变量,通常会给这个*起一个别名
import * as info from "./info.js" console.log(info.flag)
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步