requirejs代码结构分析

时间:2023-03-09 16:00:03
requirejs代码结构分析

一。函数入口函数。

req = requirejs = function (deps, callback, errback, optional) {

        //Find the right context, use default
var context, config,
contextName = defContextName; //“_” //deps 是对象的话,则可能是config。
// Determine if have config object in the call.
if (!isArray(deps) && typeof deps !== 'string') {
// deps is a config object
config = deps;
if (isArray(callback)) {
// Adjust args if there are dependencies
deps = callback;
callback = errback;
errback = optional;
} else {
deps = [];
}
} if (config && config.context) {
contextName = config.context;
}
//获取自己的属性。
//contexts:运行环境。默认 “-”
context = getOwn(contexts, contextName);
if (!context) {
//返回的核心函数,context.require = context.makeRequire();即确定了require函数。
context = contexts[contextName] = req.s.newContext(contextName);
} if (config) {
context.configure(config);
}
     //这个函数的运行得到makeRequire,会去对依赖项 从define内存中找出来,并实例化模块,
return context.require(deps, callback, errback);
};

//Create default context.

req({});    //创建一个默认环境,contexts["_"], 并且返回 一个require(deps,callback,errback);供外部使用。

cfg:一开始会去确定好baseurl,或者依赖 data-main的值会放入依赖 deps这个属性。cfg.deps会调用require函数,去检查并下载。

req(cfg); //Set up with config info.,将cfg baseurl, data-main的配置引入 依赖cfg.deps。

newContext 返回的核心函数: context.require = context.makeRequire();

makeRequire:是函数入口核心函数: req({}),会确定好环境。

makeRequire的核心代码:

context.nextTick(function () {
//Some defines could have been added since the
//require call, collect them.
console.log( this,deps ); //从define函数注册中的 对象中拿出 并实例化并init
intakeDefines();
//从register里拿或者创建 实例化模块module
requireMod = getModule(makeModuleMap(null, relMap)); //Store if map config should be applied to this require
//call for dependencies.
requireMod.skipMap = options.skipMap;
             //标记依赖,并下载。
requireMod.init(deps, callback, errback, {
enabled: true
});
// 确定是否下载了,或者超时报错,或者未超时去循环下载确定。
checkLoaded();
});

Module函数的解析:

作用:确定依赖项,和依赖项定义并执行,监听onScriptLoad,并下载。最后执行暴露函数。

主要函数以下:

enable函数:标记依赖函数,标记个数depCount,并且将依赖项makeModuleMap(统一处理路径,ID,插件头,URL,是否定义的。这种形式。),然后再次检查 是否可执行(check())。

enable():整理 依赖项的标志(个数等),->check()-第一次是下载(下载完成会自动循环检测是否下载完成。),二次是 减少依赖项,并执行暴露函数。

check:函数://check之前要确保已经 enable(处理依赖项,实例依赖项模块),检查是否没有依赖了,并运行exports。

fetch:函数:( 监听:onScriptLoad )- 》 completeLoad --》checkLoaded

completeLoad:函数:

//completeLoad从define定义的模块中 拿到对应的实例化模块,如果没有,则从shim中重新给她define并实例化模块否则报错。并检查下载。

checkLoaded:函数:

//checkLoaded: 确定是否下载了,或者超时报错,或者未超时去循环下载确定。

define函数:作用:只是将定义的模块,加入内存中。 等到require触发会从相应的内存中拿出来。

待续: