笔记一共分三部分
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()一下。
- define
-
知识点总结
-
难点1
step1:在js文件内写如下语句就可以获得该js脚本的文件路径
step2:获得.html文件的路径,再进行一步正则匹配,则可以获取js文件的相对路径。
-
难点2
怎么办呢!!回调函数一般都是在主函数内被调用的,需要在主函数调用回调函数时,为回调函数传递实参,exports require 均是 在主函数或者外部定义的变量,require 是一个函数的引用,参数为模块id,返回值为改模块定义时的回调函数。
-
难点1
-
知识点3
检测变量的类型
-
知识点4
当向html内引入js文件时,需要先创建script标签,如果需要判断src的加载情况,需要在设置src之前,为onreadystatechange
事件绑定函数,当js文件加载完毕后 ,可以移除文件,因为此js文件内定义模块的回调内容被外部对象所引用,即闭包,所以移除js文件后 不影响变量的存在问题。 -
知识点5
链接组合,
相对路径 与绝对路径组合后,,就很神奇的拼成了 相对路径对应的 绝对路径。。。 -
代码规范总结
代码能拆就拆 ,能归类就归类,,,