一、需要在html程式碼中引用兩個js檔案，並且型別需要設定為module

 <script src="info.js" type="module"></script>
 <script src="main.js" type="module"></script>

二、export指令用於匯出模組中的內容

let name = "小明";
var age = 18;
var flag = true;

function sum(num1, num2){
  return num1 + num2;
}

if(flag){
  console.log(sum(20, 30));
}

//1. 匯出方式一
export {
  flag, sum
}

//2. 匯出方式二
export var num1 = 1000;
export var height = 188;

//3. 匯出函式
export function mul(num1, num2){
  return num1+ num1;
}

//4. 匯出ES6中的類
export class Person{
  run(){-
    console.log("奔跑");
  }
}

//5. export default（注意：在同一個模組中，default只能存在一個）
// 1.
// const address = "北京市";
// export {
//   address
// }
// 2.
//export const address = "北京市";
// 3.
// const address = "北京市";
// export default address;
export default function(atgument){
  console.log(atgument);
}

三、import指令用於匯入模組中的內容

//1. 匯入的{}中定義的變數
import { flag,sum } from "./aaa.js";

if(flag){
  console.log("哈哈哈");
  console.log(sum(50,20));
}

//2. 直接匯入export定義的變數
import { num1,height } from "./aaa.js";
console.log(num1);
console.log(height);

//3. 匯入export的function、class
import { mul,Person } from "./aaa.js";
mul(30, 50);

const p= new Person();
p.run();

//4. 匯入default（addre名字可以隨便寫）
import addre from "./aaa.js"
addre("你好啊");

//5. 統一全部匯入
import * as obj from './aaa.js'
console.log(obj.flag, obj.height, obj.num1, obj.sum);

如果希望某個模組中的所有資訊都匯入

• 通過*可以匯入模組中的所有export變數
• 但是通常情況下我們需要給*起一個別名，方面後續使用

//5. 統一全部匯入
import * as obj from './aaa.js'
console.log(obj.flag, obj.height, obj.num1, obj.sum);