requirejs的加载原理 - 场景1. 定义一个require依赖a模块
我们学习一个新的技术,熟练的使用之后,就应该去探索它的原理。这篇文章我们来探索下requirejs的原理。
从4个场景来探索requirejs的原理
场景1. 定义一个require依赖b模块
场景2. 定义一个require依赖模块b,模块b依赖模块c
场景3. 定义一个依赖来自外部的js模块
场景3. 当出现循环依赖时
本篇博客讲场景1
步骤一,断点代码到define方法,我们传入的name,deps和callback被push到golbalDefQueue数据中
步骤二,断点到requirejs方法,在这个方法内部调用了intakeDefines这个方法是对步骤1中golbalDefQueue数组内容转换成module,并且调用module的init方法对模块进行了初始化,这时候module的状态为inited
步骤三:当所有的module都初始化后,进入了requirejs的settimeout函数。这里因为require(["b"], function(){})首先要生成一个自定义名字的模块,它的依赖为b,然后执行这个自定义模块的init并且设置这个module的状态为enabled。
步骤四,init方法内部会调用enable方法,这个方法是一个递归的方法,对它的依赖module递归执行enable方法。父模块会绑定一个子模块的defined事件,当子模块触发defined事件时,会将已经defined的模块加入到父模块的依赖数组中,当所有的依赖都defined后,执行父模块的的callback方法(也就是定义在require中的function)
好了,这里介绍了requirejs的加载过程,总结:
a. 首先执行define方法,将所有的定义的模块都放到golbalDefQueue中
b. 执行requirejs方法,将所有的golbalDefQueue中的模块取出,并转换成module,这时候module的状态为inited
c. 执行setimeout方法,根据require方法生产一个主module,然后eabled主module,并且依次enabled所有的依赖module。每次调用enable时,module的状态为enabled
d. 当module的所有依赖都defined时,执行require的回调方法,将module的状态更新为defined。
下篇文章继续介绍下一个场景:当依赖模块来自外部的js文件时,requirejs的执行过程。
requirejs的加载原理 - 场景1. 定义一个require依赖a模块的更多相关文章
- 【requireJS源码学习03】细究requireJS的加载流程
前言 这个星期折腾了一周,中间没有什么时间学习,周末又干了些其它事情,这个时候正好有时间,我们一起来继续学习requireJS吧 还是那句话,小钗觉得requireJS本身还是有点难度的,估计完全吸收 ...
- 老调重弹:JDBC系列之<驱动加载原理全面解析) ----转
最近在研究Mybatis框架,由于该框架基于JDBC,想要很好地理解和学习Mybatis,必须要对JDBC有较深入的了解.所以便把JDBC 这个东东翻出来,好好总结一番,作为自己的笔记,也是给读者 ...
- Grunt-cli的执行过程以及Grunt加载原理
通过本篇你可以了解到: 1 grunt-cli的执行原理 2 nodeJS中模块的加载过程 Grunt-cli原理 grunt-cli其实也是Node模块,它可以帮助我们在控制台中直接运行grunt命 ...
- 深入解析 composer 的自动加载原理 (转)
深入解析 composer 的自动加载原理 转自:https://segmentfault.com/a/1190000014948542 前言 PHP 自5.3的版本之后,已经重焕新生,命名空间.性状 ...
- Spring Boot源码分析-配置文件加载原理
在Spring Boot源码分析-启动过程中我们进行了启动源码的分析,大致了解了整个Spring Boot的启动过程,具体细节这里不再赘述,感兴趣的同学可以自行阅读.今天让我们继续阅读源码,了解配置文 ...
- iOS 下拉刷新-上拉加载原理
前言 讲下拉刷新及上拉加载之前先给大家解释UIScrollView的几个属性 contentSize是UIScrollView可以滚动的区域. contentOfinset 苹果官方文档的解释是&qu ...
- 【requireJS路径加载】与程序员小卡的交流
这两天正好看到了程序员小卡同学的一篇博客,里面对requireJS路径的解析做了一些说明,里面有点问题待解决,我这里正好知道一点,所以整理成文,不知对小卡同学是否有帮助. http://www.cnb ...
- 第三课:sea.js模块加载原理
模块加载,其实就是把js分成很多个模块,便于开发和维护.因此加载很多js模块的时候,需要动态的加载,以便提高用户体验. 在介绍模块加载库之前,先介绍一个方法. 动态加载js方法: function l ...
- (转)Unity3D研究院之异步加载游戏场景与异步加载游戏资源进度条(三十一)
异步任务相信大家应该不会陌生,那么本章内容MOMO将带领大家学习Unity中的一些异步任务.在同步加载游戏场景的时候通常会使用方法 Application.LoadLevel(“yourScene ...
随机推荐
- tomcat中修改Web站点的默认根目录
转自:http://blog.csdn.net/wzqcongcong/article/details/6387907 想把Tomcat的默认网站根目录修改成自己指定的目录,比如:F:/MyWeb.这 ...
- 高德地图——2D转换3D
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script ty ...
- 求证:-1/2 <= {2x} - {x} < 1/2
证:由 x = [x] + {x},知2x = 2[x] + 2{x}. 1.若{x}落在[0,1/2),则2{x} < 1,于是有{2x} = 2{x},此时 {2x} - {x} = {x} ...
- Python学习笔记摘要(一)类型 字符串 函数 列表 深浅拷贝
python中的对象和类型 在python中,认为系统中的每一个"东西"都是一个对象,在python中,"对象"有着特殊的意义,python中的对象有: 一个标 ...
- lsyncd替代inotify+rsync实现实时同步
因公司业务需要需要实时同步日志文件,刚一开始使用的是inotify+rsync来实现实时同步,但时间久而久之发现同步的速度越来越慢,往往延迟好几个小时.查了一下网上的inotify+rsync方案基本 ...
- ELK数据迁移,ES快照备份迁移
通过curl命令或者kibana快照备份,恢复的方式进行数据迁移 环境介绍 之前创建的ELK 因为VPC环境的问题,需要对ELK从新部署,但是还需要保留现有的数据,于是便有了这篇文档. 10.0.20 ...
- Tars | 第3篇 Tars中期汇报测试文档(Java语言实现Subset路由规则)
目录 前言 1. 任务介绍 2. 测试模拟方案 2.0 *前置工作 2.1 添加路由规则 2.2 添加存活节点 2.3 [输出]遍历输出当前存活节点 2.4 [核心]对存活节点按subset规则过滤 ...
- python 修改图像大小和分辨率
1 概念: 分辨率,指的是图像或者显示屏在长和宽上各拥有的像素个数.比如一张照片分辨率为1920x1080,意思是这张照片是由横向1920个像素点和纵向1080个像素点构成,一共包含了1920x108 ...
- 安装 Ubuntu 21.04 后必备的绝佳应用大合集(持续更新中)
@ 目录 一.Google Chrome 浏览器 1.下载 2.安装 3.设置搜索引擎 二.火焰截图(替代QQ截图) 1.简介: 2.安装: 3.设置快捷键: 三.VLC视频播放器(替代Potplay ...
- 浅谈KMP模式匹配算法
普通的模式匹配算法(BF算法) 子串的定位操作通常称为模式匹配算法 假设有一个需求,需要我们从串"a b a b c a b c a c b a b"中,寻找内容为"a ...