• 使用requireJS


    什么是require?

    require是AMD模块化规范的具体实现。

    目前,通行的js模块化规范有两种,CommonJS和AMD。

    CommonJS和AMD有什么不同呢?

    CommonJS主要用于服务端,它的特点是同步加载,在某个模块加载完成后才会加载下一模块,这在服务端没什么问题,读取速度就是硬盘的读写速度,但在浏览器中环境下,加载的模块都存储在服务器上,所以加载时间取决于客户端网速,如果网速不过关可能某个模块需要加载很长时间,那之后的模块则不会加载,这会让浏览器在一段时间内处于假死状态,这显然是不合适的。

    因此,适用于浏览器的模块化不能使用同步加载,只能用异步加载。

    于是AMD应运而生,AMD(Asynchronous Module Definition)的意思就是异步加载,解释下同步异步。

    同步异步是一种被请求者的消息通知机制

    • 同步:被请求者处理请求者请求的事,但不会通知请求者处理结果,需要请求者轮询,或者监听被请求者。
    • 异步:被请求者处理请求者请求的事,当处理结果时,通知请求者处理结果。
    • 阻塞:阻塞当前进程,当前进程不完成,不处理下一个进程。
    • 非阻塞:在当前进程处理过程中,不急于得到结果,继续处理下一个进程。

    AMD是异步加载,所有依赖加载模块的语句都放在一个回调函数中,当加载完成后执行。

    使用requireJS

    requireJS是AMD规范的实现,是客户端实现模块化的工具。AMD之与requireJS就像ECMAscript之与javascript,一个是规范,一个是规范的具体实现。

    下载requireJS,放在项目js目录下,即可加载,为避免加载时网页失去响应,建议在网页底部加载,或者写成:

    <script src="js/require.js" defer async="true" ></script>
    
    async代表要异步加载,避免网页失去响应,ie不支持这个属性,值支持defer。
    
    加载requireJS之后需要加载自己的js文件,一般用一个js文件作为模块化的入口文件,其他引入在入口文件中完成。
    
    <script src="js/require.js" data-main="js/main"></script>  // mian.js即为入口文件,因为默认加载js文件可省略js后缀。
    
    data-main 属性为指定加载主模块,上述加载中主模块为main.js,该文件会第一个被加载。
    

    如果在mian中不依赖其他模块可以直接写js程序,如果需要引用其他模块则必须使用requireJS指定的引用方式。
    requireJS用require函数加载模块,它接受两个参数,第一个参数为一个数组,指定要加载的模块,第二个参数为一个回调函数,在所有模块加载完成后执行

    require(["module"],callback(module){
        //do something……
    })
    
    

    如果我们有很多js目录,存放不同功能的js 文件,那我们可以用require.config方法来配置模块的加载行为,在文件顶部进行配置。

    require.config={
        paths:{
            "module1":"module1",
            "module2":"module2",
            "module1":"module3",
        }
    }
    
    
    只研朱墨作春山
  • 相关阅读:
    比特币节点同步问题
    Vue用axios跨域访问数据
    vue之vue-cookies安装和使用说明
    vuejs目录结构启动项目安装nodejs命令,api配置信息思维导图版
    使用以太坊智能合约实现面向需要做凭证的企业服务帮助企业信息凭证区块链化
    将任意文件写入以太坊区块的方法,把重要事件,历史事件,人生轨迹加密记录到区块链永久封存
    Linux下几种重启Nginx的方式,找出nginx配置文件路径和测试配置文件是否正确
    php小数加减精度问题,比特币计算精度问题
    Fabric架构:抽象的逻辑架构与实际的运行时架构
    国外互联网大企业(flag)的涨薪方式
  • 原文地址:https://www.cnblogs.com/guolintao/p/8029295.html
Copyright © 2020-2023  润新知