美文网首页
Module 的加载

Module 的加载

作者: 努力与幸运 | 来源:发表于2018-07-03 17:03 被阅读7次
    <script src="path/to/myModule.js" defer></script>
    <script src="path/to/myModule.js" async></script>
    

    defer与async的区别是:前者要等到整个页面正常渲染结束,才会执行;后者一旦下载完,渲染引擎就会中断渲染,执行这个脚本以后,再继续渲染。一句话,defer是“渲染完再执行”,async是“下载完就执行”。另外,如果有多个defer脚本,会按照它们在页面出现的顺序加载,而多个async脚本是不能保证加载顺序的。

    <script type="module" src="foo.js"></script>
    <!-- 等同于 -->
    <script type="module" src="foo.js" defer></script>
    

    对于外部的模块脚本,需要注意:

    1,代码是在模块作用域之中运行,而不是在全局作用域运行。模块内部的顶层变量,外部不可见。
    2,模块脚本自动采用严格模式,不管有没有声明use strict。
    3,模块之中,可以使用import命令加载其他模块(.js后缀不可省略,需要提供绝对 URL 或相对 URL),也可以使用export命令输出对外接口。
    4,模块之中,顶层的this关键字返回undefined,而不是指向window。也就是说,在模块顶层使用this关键字,是无意义的。
    5,同一个模块如果加载多次,将只执行一次。

    相关文章

      网友评论

          本文标题:Module 的加载

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