es6模块export和import使用总结

一个模块就是一个文件,其它文件是无法获取这个模块里面的变量,如果需要外面的文件也能够读取这些变量,你可以使用export输出变量,外面的文件则import这个模块的变量。

1. export导出模块变量

 export命令可以出现在模块的任何位置,只要处于模块顶层就可以。如果处于块级作用域内,就会报错

    导出变量有两种方式

    1) 单个分别导出每一个变量  export const 变量...

       math.js  导出变量,函数

      es6模块export和import使用总结_第1张图片

    2)使用一对大括号统一导出变量 export {变量1, 变量2...}

        es6模块export和import使用总结_第2张图片

2. import 导入模块变量

  1) 按需导入其它模块变量

    这里在导入的时候对sub变量重命名,import的时候必须使用大括号{}

    

    

2) 一次性全部导入模块变量

 es6模块export和import使用总结_第3张图片

3. export default 为模块指定默认输出

    一个js只能有一个export default

    print.js

4. 多个js文件合并成一个js文件,import的时候只import一个文件即可

文件1: cst/dbconfig.js

es6模块export和import使用总结_第4张图片

文件2: cst/user.js

合并文件: cst/constant.js

使用:

es6模块export和import使用总结_第5张图片

es6模块export和import使用总结_第6张图片

你可能感兴趣的:(前端)