requirejs的初步掌握

墨韵明空      2022-02-08     626

关键词:

前一段时间,因为一些事吧这个习惯落下了,现在争取重新捡起来。

最近开始自学requireJS,为了更好的掌握,所以写出一个自我理解的博客供参考。

分割线-------------------------


 

首先,学习requireJS,要知道什么是requireJS.

requireJS是一个可在js和node环境下运行的一个非常小巧的一个AMD规范下的js模块载入框架,通俗的理解为模块加载器。

相信开始学习requireJS的一定对JS代码的模块化有一个初步的了解了。而requireJS主要解决了两大问题

第一。在传统的模块化封装中一定对那难堪入目的引入方式和引入的先后顺序有很大的排斥和烦恼。

<script type="text/javascript" src="a.js"></script>
<script type="text/javascript" src="b.js"></script>
<script type="text/javascript" src="c.js"></script>
<script type="text/javascript" src="d.js"></script>
<script type="text/javascript" src="e.js"></script>
<script type="text/javascript" src="f.js"></script>
<script type="text/javascript" src="g.js"></script>
<script type="text/javascript" src="h.js"></script>
<script type="text/javascript" src="i.js"></script>
<script type="text/javascript" src="j.js"></script>

而requireJS很好的解决了这个问题,(在之后的讲述中会讲到解决方式)

第二。相信大家应该也遇到过JS阻塞浏览器渲染这个问题。

<!DOCTYPE html>
<html>
    <head>
          <title></title>
    </head>
    <body>
      <span>hello world</span>
      <script type="text/javascript">
            alert(1);
       </script> 
    </body>
</html>
   

你会发现,浏览器运行后会先执行alert,这时候页面应该是一片空白,点击确定后在加载body中的内容。

这就是JS阻塞浏览器渲染导致的。

有写同学就会说,可以增加async和defer什么的,也可以避免出现阻塞!

其实这个想法很好,我之前也是这么想的。但是我没考虑到的是,当引入外部js过多的情况下,这种方式不好控制异步加载的顺序,导致出现错误。

而如何控制加载顺序,那么就有回到了第一个问题了。requireJS会有好的帮我们处理好这些顾虑。

这也就是我们下一章要讲的依赖的问题。

 

这里顺便给同学们简单的描述下AMD和CMD的概述和区别

AMD:是"Asynchronous Module Definition"的缩写,意思就是"异步模块定义"。它采用异步方式加载模块,模块的加载不影响它后面语句的运行。所有依赖这个模块的语句,都定义在一个回调函数中,等到加载完成之后,这个回调函数才会运行。

CMD:是"Common Module Definition"的缩写,意思就是“常用模块定义”。它采用的是延迟加载模块,使用的时候加载所需要的模块,定义在唯一的参数里面边封装,边加载,边依赖。

AMD和CMD的本质区别就是:amd采用的是依赖前置,而cmd采用的是延迟依赖。


 

requireJS的初步了解先讲到这里,相信大家应该和我一样,有了一定的了解。

下一章节描述,requireJS的依赖和常用的API。也希望和大家能共同进步

 

 

   

 

js--一篇文章掌握requirejs常用知识

本文采取循序渐进的方式,从理论到实践,从RequireJS官方API文档中,总结出在使用RequireJS过程中最常用的一些用法,并对文档中不够清晰具体的内容,加以例证和分析,分享给大家供大家参考,具体内容如下1.模块化相信每个前... 查看详情

使用requirejs的方法

  在你们对requireJs初步了解后,快来看看他们是怎么使用的吧。  在你下载完成require.js插件后,在页面里引入,在require.js加载完之后,会查找页面上script标签的data-main属性的值,然后加载,data-main指定的js文件, 定义... 查看详情

初步掌握hdfs的架构及原理

目录HDFS是做什么的HDFS从何而来为什么选择HDFS存储数据HDFS如何存储数据HDFS如何读取文件HDFS如何写入文件HDFS副本存放策略Hadoop2.x新特性1、HDFS是做什么的  HDFS(HadoopDistributedFileSystem)是Hadoop项目的核心子项目,是分布式计算... 查看详情

docker从入门到初步掌握(代码片段)

提纲:Docker和Kubernetes关系本人开始今天分享之前想提以前简单的问题,大家可以试试回答。Kubernetes和Docker关系?Kubernetes的作用是管理容器,docker一旦变多,重启,容器通信等一系列过程就需要一个工具来进行管理,这就... 查看详情

实验三初步掌握spark程序设计(代码片段)

1.统计文本中性别为“男”的用户数。文件格式如图packagecom.spark.homework.initSparkimportorg.apache.spark.SparkConf,SparkContextimportorg.apache.spark.rdd.RDDobjectcount_maledefmain(args:Array[String]):Unit=//TODO建立和Spar 查看详情

对排序算法的初步探究

初学排序算法,我觉得只需要掌握算法的精髓,没必要把所有算法都实现一遍,下面我会实现一些经典的排序算法。(均采用C++实现)学习的排序算法包含:1》插入排序(直接插入排序、希尔排序)2》选择排序(简单选择排序、... 查看详情

初步掌握node的路由控制

1.1.2:node.js的路由控制1.运行原理  在1.1.1节中,提到过app.js中app.get("/",routes.index)可以用以下代码取代:app.get("/",function(req,res)res.render("index",title:"Express");)    这段代码可以这样理解:当访问主页时,调用ejs模板... 查看详情

关于bfc的初步了解以及常见使用

  在学习CSS的过程中,掌握一些常用方法或效果实现的原理对于我们的学习来说是很有帮助的。如最常见的清除浮动和取消外边距塌陷时使用overflow:hidden;,在学习初期往往只知道有这种用法,且使用时会受限,这样在学习掌... 查看详情

阅读笔记《软件需求与分析》需要掌握的内容

我们应当怎样做需求调研?首先是双方初步认识,这个时候需要树立良好的职业威信,在交谈中进行详细角色分析,将与会各方代表对号入座,最后从宏观上制订目标与方案。做好初步认识之后,接下来就要一一去拜访这些对应... 查看详情

数学软件实训1-matlab程序设计及应用初步

数学软件实训任务一一题目:MATLAB程序设计及应用初步二目的:掌握MATLAB程序设计的基本方法,会利用MATLAB程序设计思想编程处理一些简单问题。三要求:      1掌握控制流的基本语法结构。   &n... 查看详情

算法分析初步

注:这个是我去年这个时候做的笔记,现在这部分内容我已经基本掌握,在博客上做个备份算法分析一、渐进符号渐近分析是一种描述函数在极限附近的行为的方法,算法分析一般考虑给定算法在输入非常大的数据集时候的性能... 查看详情

openstack入门之初步认识

从OpenStack基础知识开始学起,剖析openstack架构,分析OpenStack的各个组件的功能、原理和使用方法,通过实战演练来掌握OpenStack的部署和操作。为今后学习OpenStack的高级课程以及基于OpenStack构建企业级云计算系统打下基础。在接下... 查看详情

初步接触lvs

今天整理下思绪,定下要掌握LVS原理和使用方法。于是,看了部分关于LVS的概述和文章。章博士在2002年写的LVS的几篇文章,在我看来,今天都值得一看。http://www.linuxvirtualserver.org/zh/lvs1.htmlLVS的英文官网,http://www.linux-vs.org/附上... 查看详情

初学jsp

...能最强大,却也最复杂的语言,小学期在老师的带领下我初步认识了这种语言,虽然对这种语言有了初步的了解,但离精通还离得很远,很多时候都跟不上老师的节奏,第一次接触这门语言确实是一个很痛苦的过程,老师讲的东... 查看详情

对nio的初步理解

前言项目中简单用到了Netty,因此特意对NIO进行了一些了解。发现NIO和Netty篇幅庞大,不是几天可以熟悉掌握的,因此打算后面特意花时间好好学习一下,这里先记录一下已经学习的,对NIO的一些简单理解。BIO... 查看详情

c++基础二类和对象(上篇)(10000字掌握c++类核心内容)(代码片段)

文章目录1.面向过程和面向对象初步认识2.类的引入3.类的定义4.类的访问限定符及封装4.1访问限定符4.2封装5.类的作用域6.类的实例化7.类对象模型7.1如何计算类对象的大小7.2类对象的存储方式猜测7.3结构体内存对齐规则8.类成员... 查看详情

我认为测试需要掌握的技能

...情况,尽可能的掌握更多的错误信息。通过错误信息进行初步的分析,如果开发报出来的错误信息过于简略,也应该保留错误信息给开发自己去看,并建议他报错的内容尽可能的写的详细些。3、通过报错信息,以查看代码等方... 查看详情

requirejs

1、为什么要使用RequireJS1、有效的防止命名冲突2、声明不同js文件之间的依赖3、可以让我们的代码以模块化的方式组织 2、RequireJs常用的方法1、requirejs.config   通常为模块指定别名,方便模块的引用2、requirejs    ... 查看详情