這篇文章帶給大家的內容是關於es6中模組化的內容介紹(程式碼範例),有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。
概述
模組化是一個大型專案的必然趨勢。
命名導出
可以使用export
關鍵字,匯出你要匯出的東西,可以匯出常數、變數、函數、類別,
// export.js export var var0 = 'var0' // 直接导出 var 声明 export let let0 = 'let0' // 直接导出 let 声明 export const const0 = 'const' // 直接导出 const 导出 export function func1() {} // 直接导出函数 export function* funcx() {} // 直接导出生成器函数 export class class0{} // 直接导出类 let variable = 'variable' export {variable} // 先声明后导出, 需要使用{} 包裹 function func2(){} export {func2} // 先声明后导出,需要使用 {} 包裹 function* funcx(){} export {funcx} // 先声明后导出,需要使用 {} 包裹 class class1{} export {class1} // 先声明后导出,需要使用 {} 包裹 export {class1 as Person} // 别名导出
命名導入需要使用{}
包裹,可以同時導入多個命名導出
import {var0} from './export' // 导入 var0 import {let0} from './export' // 导入 let0 import {const0} from './export' // 导入 const0 import {func1} from './export' // 导入 func1 import {funcx} from './export' // 导入 funcx import {class0} from './export' // 导入 class0 import {var0, let0} from "./export"; // 同时导入多个命令导出 import {Person as class1} from "./export"; // 导入后取别名
預設導出可以使用default
關鍵字,可以匿名導出
export default 1 // 默认导出常量 export default function () {} // 默认导出 export default () => {} export default function* () {} export default class {}
因為預設導出導出的其實是匿名導出,所以導入的時候可以用任意名字導入,並且無需使用{}
包裹
import num from './export' import func from './export' import arrowFunc from './export' import generatorFunc from './export' import class0 from './export'
#將一個模組的所有導出都導入
import * as MyModule from './export'
將另一個模組的東西當作目前模組直接匯出
export {var0} from './export' export * from './export'
以上是es6中模組化的內容介紹(程式碼範例)的詳細內容。更多資訊請關注PHP中文網其他相關文章!