美文网首页
如何解决模块循环引用问题

如何解决模块循环引用问题

作者: _一九九一_ | 来源:发表于2020-01-02 11:41 被阅读0次

    怎么叫模块循环引用

    • a脚本的执行依赖b脚本,b脚本的执行依赖a脚本
    // a.js
    var b = require('b');
    
    // b.js
    var a = require('a');
    

    两种解决方案:

    CommonJS模块

    • 使用require语句导入模块,module.exports导出模块,输出的是值的拷贝,按需引入,同步执行
    • 对于基本数据类型,属于复制,对于复杂数据类型,属于浅拷贝
    • 如何解决循环加载的原理:循环加载时,属于加载时执行。即脚本代码在require的时候,就会全部执行,然后在内存中生成该模块的一个说明对象。当再次执行require命令,下次会直接读取缓存。一旦出现某个模块被"循环加载"就只输出已经执行的部分,还未执行的部分不会输出(解决原理)
    {
        id: '',  //模块名,唯一
        exports: {  //模块输出的各个接口 使用当的时候,会来这里取值
            ...
        },
        loaded: true,  //模块的脚本是否执行完毕
        ...
    }
    
    • 解决模块循环引用问题,nodejs推荐使用

    ES6模块

    • import语句导入模块,export语句导出模块,是异步的
    • ES6模块原理:不论是基本数据类型还是复杂数据类型。当模块遇到import命令时,就会生成一个只读引用,脚本真正执行时,再根据这个只读引用,到被加载的那个模块里面去取值。循环加载时,ES6模块是动态引用。只要两个模块之间存在某个引用,代码就能够执行(解决原理)
    //a.js
    console.log("before import b")
    import {b} from "./b"
    console.log("b is " + b)
    export let a = b+1;
    
    //b.js
    console.log("before import a")
    import {a} from "./a"
    console.log("a is " + a)
    export let b = a+1;
    

    执行结果:

    // before import a
    // a is undefined
    // before import b
    // b is NAN
    
    • 解决模块循环引用问题,前端推荐使用

    相关文章

      网友评论

          本文标题:如何解决模块循环引用问题

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