介绍两个命令

1.export 规定模块对外的接口

    导出变量示例,可分别导出和一次性导出
        export var a = 1;
        export var b = 2;
        export var c = 3;
        或者
        var a = '1';
        var b = '2';
        var c = 3;
        export {a, b, c};
    还可以导出函数和类
        export function people(){
            console.log(1)
        }
        export class people{
            constructor(name){
                this.name=name
            }
            getName(){
                console.log(this.name)
            }
        }
    as关键字变更导出模块名
        var a=1;
        var b=2;
        var c=3;
        export {a as name,b as age,c as sex}
    注意情况
        1.export语句输出的接口，与其对应的值是动态绑定关系，即通过该接口，可以取到模块内部实时的值;
            export var str = 'hello';
            setTimeout(() => str = 'world', 1000);
            console.log(str)
            上面代码输出变量str，值为hello，1秒之后变成world
        2.export命令可以出现在模块的任何位置，只要处于模块顶层就可以。如果处于块级作用域内，就会报错；
            function foo() {
              export default 'bar' // SyntaxError
            }
            foo()

2.import 引入其他模块提供的功能,主要有以下三种情况

    1.默认导入
        当export 这种方式时
        //a.js
        export default function(){
            console.log(1)
        }
        对应的import
        //b.js
        import hanshu from './b.js'
        hanshu()
    2.部分导入
        当export 这种方式时
        var a = '1';
        var b = '2';
        var c = 3;
        export {a, b, c};
        对应的import
        import {a,b} from './App.js'
        console.log(a,b)
    3.全部导入
        当export 这种方式时
        var a = '1';
        var b = '2';
        var c = 3;
        export {a, b, c};
        对应的import
        import * as data from './App.js'
        console.log(data)
    注意:1.一个模块就是一个独立的文件，该文件内部的所有变量都是局部变量,外部不可获取
        2.如果想为输入的变量重新取一个名字，也可以使用 as 关键字，将输入的变量重命名。类似于export
        3.如果import 引入的模块,js后缀可以省略,可以是相对路径也可以是绝对路径,绝对路径当前文件夹'./a.js',和模块区分开
        4.import命令具有提升效果，会提升到整个模块的头部，首先执行
        5.import是静态执行，所以不能使用表达式和变量
        6.一个模块只能有一个默认输出，因此 export default 命令只能使用一次。实际本质上，export default 就是输出一个叫做 default 的变量或方法，系统允许你为它取任意名字；

es6模块特点

1.每一个模块只加载一次， 每一个JS只执行一次， 如果下次再去加载同目录下同文件，直接从内存中读取；
2.每一个模块内声明的变量都是局部变量， 不会污染全局作用域；
3.模块内部的变量或者函数可以通过export导出；
4.一个模块可以导入别的模块

练习1

a.js
    var a = '1';
    var b = '2';
    var c = 3;
    export {a, b, c};
b.js
    import {a,b,c} from './a.js'

练习2

a.js
    export function people(){
        console.log(1)
    }
b.js
    import {people} from './a.js'
    people()

练习3

a.js
    export class people{
        constructor(name){
            this.name=name
        }
        getName(){
            console.log(this.name)
        }
    }
b.js
    import {people} from './a.js'
    let p1=new people('xiaoming')
    p1.getName()

练习4

a.js
    var a=1;
    var b=2;
    var c=3;
    export {a as name,b as age,c as sex}
b.js
    import {name,age,sex} from './a.js'
    console.log(name,age,sex)