es6语法 export 导出， import导入

import属于编译时加载，和Node的require的运行时加载不同，所以import语句是最先执行的，因此下列写法会报错

var x = 2;
if(x == 2){
    import {name} from "./name"
}

export和import的基本用法

//moudleTest.js
let i = 1;
let j = 2;
export {i, j}


//main.js

import {i, j} from './moudleTest.js'

console.log(i); // 1
console.log(j); // 2




//和上面等效的另外一种写法是：


//moudleTest.js
let i = 1;
let j = 2;
export {i};
export {j};


//main.js

import {i} from './moudleTest.js'
import {j} from './moudleTest.js'

console.log(i); // 1
console.log(j); // 2

export 有一种情况要注意：

用export导出之后被声明的变量，这个变量的值为undefined

//moduleTest.js
let i = 1;


export  {i, j};

let j = 2;


//main.js


import {i} from './moduleTest';
import {j} from './moduleTest'
console.log({
    i : i,
    j : j
})

输出结果：

export default： 当使用者不想知道导出文件中变量的具体名字时，可以使用默认导出的方式

//moduleTest.js


let i = 1;
export default i;

// main.js

import im from './moduleTest.js'

console.log(im); // im是随便取的，值为1

import *： 当你想导出导出文件里的全部导出变量时，你可以用这种方式导出

要注意的是，这种方式导出的是一个对象，导出量是它的属性

例子：

//moduleTest.js

let i = 1;
export default i;
export function each(obj, iterator, context) {
    // ···
}


//main.js

import  * as im from './moduleTest.js'

console.log(im); 

结果：

这里我们要特别关注的是默认导出的结果，我们发现默认导出的属性名是default，所以说默认导出的实质就是将变量的值赋给default，然后以default为接口导出，导入时，可以以任意名称导入