美文网首页
es6学习笔记整理(十七)模块化

es6学习笔记整理(十七)模块化

作者: 尤樊容 | 来源:发表于2018-03-15 15:17 被阅读10次
    导出用export,导入使用import
    导入导出1:

    最基本的使用

    //导入
    export let str = 'asdf';
    export function test(){
        console.log('函数');
    }
    export class Test2{
        test3(){
            console.log('类');
        }
    }
    
    //导出所有模块,这样写比较麻烦
    import {str,test,Test2} from 'model2';
    console.log(str,test,Test2);
    

    也可以只导出其中的某一个

    import {str} from 'model2';
    console.log(str);
    
    导入导出2:

    在模块比较多的情况下,一个一个写就不现实了,这是就可以用 * as 别名 的格式。如下:
    导出还是和上面一样,导入不同。

    import * as model from 'model2';
    console.log(model.str);
    console.log(model.test);
    console.log(model.Test2);
    
    导入导出3(推荐):

    导出:

    let str = 'asdf';
    function test(){
        console.log('函数');
    }
    class Test2{
        test3(){
            console.log('类');
        }
    }
    
    export default {
        str,
        test,
        Test2
    }
    

    导入:

    import model from 'model2';
    console.log(model.str);
    console.log(model.test);
    console.log(model.Test2);
    

    推荐这种的原因:

    • 安全。不导出的模块不暴露
    • 用default导出的时候,不用管名称的对应,简洁不少

    相关文章

      网友评论

          本文标题:es6学习笔记整理(十七)模块化

          本文链接:https://www.haomeiwen.com/subject/bqqofftx.html