JS导出和导入模块

本文所写的内容皆来自红宝书，并且是ES6的知识。

本篇博文阅读方法: 命名导出对应命名导入，默认导出对应默认导入。

模块导出

export关键字用于声明一个值为命名导出。导出语句必须在模块顶级，不能嵌套在某个块中:

// 允许
export ...

// 不允许
if (condition)
{
    export ...
}

命名导出

// example1
export const foo = 'foo';

// example2
const foo = 'foo';
export { foo };

// example3
const foo = 'foo';
const foo1 = 'foo1';
export { foo, foo1 };

// example4
const foo = 'foo';
export { foo as myFoo };

默认导出

// example1
const foo = 'foo';
export default foo;

// example2
cosnt foo = 'foo';
export { foo as default };

//example3
const foo = 'foo';
const foo1 = 'foo1';
export { foo1 };
export default foo;

// example4
const foo = 'foo';
const foo1 = 'foo1';
export { foo as default, foo1 };

模块导入

与export类似，import必须出现在模块的顶级。

命名导入

// example1
import { foo } from './fooModule.js';
console.log(foo);

// example2
import {foo1, * as Foo} as Foo from './foo.js';
console.log(Foo.foo);

默认导入

// example1 这种方法可导入* as name 或 默认导出的值。*中不含有默认导出的值。
import foo from './foo.js';
console.log(foo);
// example2
import { default as foo } from './foo.js';
console.log(foo);

本篇完。