模塊化：模塊是一個文件
好處：
1.減少命名沖突
2.避免引入時的層層依賴
3.可以提升執行效率
**第一種方法***********************
1.如何導出（暴露）
export let run =function(){
console.log("run-->fun")
}
export let userName = "jinglijuan"
2.如何引入（依賴）
<script type="module"> //設置為module類型
import {run,userName} from "./mo.js" //內部名字要與暴露出來的名字一致
run();
console.log(userName)
</script>
**第二種方法 :暴露的數據過多時使用
1. 導出時正常導出
export let run =function(){
console.log("run-->fun")
}
export let userName = "jinglijuan"
2. 導入時
<script type = "module">
import * as 別名 from './mo.js'
console.log(別名.暴露的方法或者變量名)
console.log(mo.run)
</script>
**第三種方法：直接導出對象
1. 導出：
let run = function(){
console.log("jinglijuan")
}
let userName = "jinglijuan"
let age = 21
let sex = "woman"
export {
run,
userName,
age,
sex
}
2. 如何導入（接收）：
import {userName,age} from "./mo.js"
console.log(userName,age)
**第四種方法：導出的數據起個別名
導出時通過as給導出的內容起個別名，接收時需要以別名為依據
1. 導出：
let age = 21
let sex = "woman"
export {
age as a,
sex
}
2. 如何導入（接收）：
import {userName,a} from "./mo.js"
console.log(userName,a)
**第五種，引入時增加別名（從不同文件中的引入的變量名或者方法名可能是重名的，引入時使用會報錯）
1.引入
import {userName as moUserName} from './mo4.js'
import {userName} from './mo5.js'
console.log(moUserName,userName)
**第六種：默認導出（使用頻率最高）
只能有一個默認對象
1.導出（暴露）
export default {
userName:'jinglijuan',
age:20
}
2.引入（接收）
import mo from "./mo.js"
console.log(mo.userName)
**第七種：混合導出
1.導出（暴露）
export default{
userName:'jinglijuan',
age:20
}
export let sex = '男'
2.引入
import mo,{sex} from './mo7.js'
console(mo.userName,mo.age,sex)
模塊的特點：
1.可以相互依賴
2.當你的模塊被多次引入時，只執行一次
在多處引入相同的js文件，那么這個js文件只會執行一次