ModuleLoad总结

源码链接

笔记一共分三部分
1、思路总结 2、知识点总结 3、代码规范总结

• 思路总结
• 新建全局对象
  (function(global){ global.ModuleLoad={} })(this)
  将ModuleLoad设置为全局对象，立即执行函数内声明的均为私有变量，不会污染全局。
• 为全局对象设置两个特权方法
  global.ModuleLoad = {
  define : defineModule
  ,require : requireModule
  }
  • define
    作用：定义模块 ，
    function( id , deps , factory ) {
    ……
    }
    三个参数分别为：id：模块id，deps：模块依赖，factory：模块的执行内容。
    前两个是可选参数，第三个为必填参数，模块依赖需要是数组。
    考虑：
    1、如果模块是匿名，即用户只写了factory或者deps＋factory，程序应该根据模块的路径为模块命名，保证每个模块都有自己独一无二的名字。
    setModule( id , deps , factory )
    modules是一个对象，每个属性对应着已经定义过的模块，每次定义模块时都要检查模块是否已经被定义过，对已经定义过的模块则跳过。
    难点1：根据路径获取匿名模块的名字。
    2 、判断模块的依赖是否加载完毕。
    triggerCreate( module , moduleName )
    这块的逻辑 太混乱！
    step1:判断模块的依赖是否全部加载完毕，如果没有，则跳出函数，执行后续的checkDeps( module.deps , moduleName ) ，可以对未加载的模块进行加载。
    step2:模块只有当模块执行完自己的回调后，其状态才会修改为done，当模块的依赖全部加载完毕 ，则createModuleInfo( exports , _exports , id , module.factory )，对已加载完依赖的模块的infor属性赋值为回调函数exports的对象。
    难点2 需要在回调函数内使用require exports
    如果模块加载完毕 ，则判断一下，该模块是否被全局require过，如果有，则需要对requires数组进行遍历，看一下每个元素的arr属性（保存着依赖），检查一下该模块是否在里面 ，如果有 则 对result数组赋值，减少resultlen的值，当值为零时 ，说明 可以执行这组依赖的回调啦。
    step3:加载未被加载的依赖
    checkDeps( module.deps , moduleName )
    如果模块之前就被全局require过 说明已经加载过js啦 ，则没有必要加载啦，加载依赖的的时候 还需要改变模块自己和依赖的状态为doing，并且根据module.make设置依赖关系。
    总结：以上为define，直到所有只要有依赖加载完毕都会trigger一下 ，去判断模块的make的依赖是否全部加载完毕。
  • require
    判断依赖是否被定义过（检查modules），如果没有 就自己loadScript（）一下。
• 知识点总结
  • 难点1
    step1:在js文件内写如下语句就可以获得该js脚本的文件路径
    js文件的路径
    step2:获得.html文件的路径，再进行一步正则匹配，则可以获取js文件的相对路径。
    Paste_Image.png
  • 难点2
    怎么办呢！！回调函数一般都是在主函数内被调用的，需要在主函数调用回调函数时，为回调函数传递实参，exports require 均是 在主函数或者外部定义的变量，require 是一个函数的引用，参数为模块id，返回值为改模块定义时的回调函数。
• 知识点3
  检测变量的类型
  Paste_Image.png
• 知识点4
  当向html内引入js文件时，需要先创建script标签，如果需要判断src的加载情况，需要在设置src之前，为onreadystatechange事件绑定函数，当js文件加载完毕后 ，可以移除文件，因为此js文件内定义模块的回调内容被外部对象所引用，即闭包，所以移除js文件后 不影响变量的存在问题。
• 知识点5
  链接组合，
  Paste_Image.png
  相对路径 与绝对路径组合后，，就很神奇的拼成了 相对路径对应的 绝对路径。。。
• 代码规范总结
  代码能拆就拆 ，能归类就归类，，，