ES Module

◼ ES Module和CommonJS的模块化有一些不同之处：
 一方面它使用了import和export关键字；
 另一方面它采用编译期的静态分析，并且也加入了动态引用的方式；
◼ ES Module模块采用export和import关键字来实现模块化：
 export负责将模块内的内容导出；
 import负责从其他模块导入内容；
◼ 了解：采用ES Module将自动采用严格模式：use strict

你需要注意本地测试 — 如果你通过本地加载Html 文件 (比如一个 file:// 路径的文件), 你将会遇到 CORS 错误，因为Javascript 模块安全性需要；

/ 3.导出方式三:
export const name = "why"
export const age = 18
 
export function sayHello() {
  console.log("sayHello")
}
 
export class Person {}
 
// console.log(name)
 
// 1.导出方式一: 
// export {
//   name,
//   age,
//   sayHello
// }
 
// 2.导出方式二: 导出时给标识符起一个别名
// export {
//   name as fname,
//   age,
//   sayHello
// }

// 1.导入方式一: 
// import { name, age, sayHello } from "./foo.js"
 
// 2.导入方式二: 导入时给标识符起别名
// import { name as fname, age, sayHello } from "./foo.js"
 
// 3.导入时可以给整个模块起别名
import * as foo from "./foo.js"
 
const name = "main"
 
console.log(name)
console.log(foo.name)
console.log(foo.age)
foo.sayHello()

默认导出
◼ 前面我们学习的导出功能都是有名字的导出（named exports）：
 在导出export时指定了名字；
 在导入import时需要知道具体的名字；
◼ 还有一种导出叫做默认导出（default export）
 默认导出export时可以不需要指定名字；
 在导入时不需要使用 {}，并且可以自己来指定名字；
 它也方便我们和现有的CommonJS等规范相互操作；
◼ 注意：在一个模块中，只能有一个默认导出（default export）；