在ES6之前，我们浏览器端的模块化开发几乎都是基于require.js和sea.js，两者分别基于amd和cmd规范产生的库。现在ES6也有自己的模块化语法，分别是用export输出模块，import导入模块。

export输出

//a.js
//输出单个变量
export var a='A';
//输出多个变量
var b='b';
var c='c';
var d='d';
export{b,c,d};
//重命名输出
export{b as b1,c as c1,d as d1}
//输出单个函数
export function fn() { 
    this.name="jack ma";
    console.log('fn');
 function fn1(){
 function fn2(){
function fn3(){
//输出多个函数
export {fn1,fn2,fn3}
//输出class
export class modules{
    constructor(){
}

import导入

//导入全部变量
import * as alls from './a.js';
console.log(alls);
//导入指定的变量
import{a,b,c} from './a.js'
console.log(a,b,c)
//导入指定的变量并重命名
import{a as a1,b as b1,c as c1} from './a.js'
console.log(a1,b1,c1)

import导入的模块都是引用

我们知道js中，值类型都是复制原始值重新开辟一块内存空间，只有引用类型才是引用地址。

代码引用：https://exploringjs.com/es6/ch_modules.html#_imports-are-read-only-views-on-exports

export let counter = 3;
export function incCounter() {
    counter++;
export function setCounter(value) {
    counter = value;
//main.js
import { counter, incCounter ,setCounter} from './lib';