module

module

1. import 和 export,同步加载，在编译阶段确定依赖关系

    //a.js
    export const a =1
    const b =2
    export {b}
    const c =3
    export {d as c}
    export default 4 //默认输出
    //b.js
    import a form 'a.js'
    a//4
    import {a,b,d as c} from 'a.js'
    a//1
    b//2
    c//3
    import * as d from 'a.js'//整体加载
    d.a//1
    d.b//2
    d.c//3
    d.default//4
   

2. import()动态加载模块，异步加载返回promise对象
3. 浏览器加载规则
   • 同步加载，js默认同步加载
   • async 异步加载，加载完就执行，执行顺序不定
   • defer 异步加载，整个页面渲染完后按序执行 es6module默认defer加载
4. es6模块与commonjs模块差异
   • commonjs模块输出是值拷贝，es6模块输出是值引用
   • commonjs模块是运行时加载，es6模块是编译时输出接口

tips

1. 循环加载
   • commonjs模块遇到循环加载只输出已执行的文件（非完整文件）
   • es6模块在编译时确定接口，输出模块的所有暴露接口，但具体值不定，在使用到模块内具体变量时，判断是否可用