es6模块化

62 阅读1分钟

理解1:在严格模式下执行js代码,模块中声明的变量、函数等都不会自动添加在全局作用域中

理解2:一个文件就是一个模块,模块之间互不相通,故使用export向外暴露,通过import在其他模块中使用

优点:可实现按需导入,代码复用

按需导入

语法: 导出 export const/let 变量名=值/函数 导入 import {某变量名} from '模块url'

//导出
export let name="xm"
export let fn=()=>{
    console.log('321')
}
//导入
import * as all from './02-es6模块.js'//as取别名
console.log(all)
import {name,fn as ff} from './02-es6模块.js'
console.log(name)
ff()

默认导入

语法:导出 export default {导出成员} 导入 import 任意变量名 from '模块url'

//导出
const sex=0
export default{//一个模板只能出现一次默认导出
    sex,
    age:24,
    fn:function(){
        console.log(11)
    }
}
//导入
import f from './02-es6模块.js'
console.log(`性别:${f.sex},年龄:${f.age}`)
f.fn()