模块化导入导出的方法

模块化概述

模块化就是将独立的一个功能封装到一个模块（文件）中，模块和模块之间是相互独立、相互隔离。
模块和模块之间虽然是相互独立的，但一个模块可以通过特定的接口公开自己的内部成员，以便让其它的模块可以使用或者访问自己的内部成员。

ES6模块化

ES6模块化规范中定义：

• 每一个 js 文件都是独立的模块
• 导入模块成员使用 import 关键字
• 暴露模块成员使用 export 关键字

方法一

导出

const a =1;
const b =2;
export default {
    a,b
}

导入

import a from "./a"
console.log(a);

效果：

方法二

单独导出

export const a = 1;
export const b = 2;
export const c = function(){
	return 1000
}

导入（如果是单独导出的话，导入的时候变量需要使用{ }解构出来）

import {a ,b,c} from "./a"
console.log(a,b,c);

效果：

注：这种方法不建议使用，当你有上千个变量需要暴露的时候，那这种方法无疑是最费时费力的。可以尝试这种导入方法

import * as A from "./a"
console.log(A.a,A.b,A.c);

效果：

方法三

导出

export const a = 1;
export default {
    b:20
}

导入

import A,{a} from "./a"
console.log(A,a);

效果

方法四

导出

const a = 1
const b = 2
export {a,b}

导入

import {a,b} from "./a"
console.log(a,b);

效果

了解完上述的几种模块化导入导出的方法，相信你在日后再遇到导入导出的问题就可以迎刃而解了。