2006年,由于微软的名声比SUN公司的名声要大,选择了asp.net,利用VS开发了很多项目,那个时候觉得自己真是很牛气,什么都能做;现在随着互联网和移动互联的冲击,这些传统技术也受到了冲击,由于ASP.NET不开源,市场迅速减少;让我也开始怀疑微软在做什么了?所以我不在等了,2014年,开始转行java;开启了java之路;互联网之旅,从此开始了。

一个项目团队,竟然没有做前端开发,把团队成员都当做特种兵,我又从服务端开始接触前端。

一个服务端程序员,开始专心研究前端,这是要转行的节奏吗?扯远了,开始我们今天的主题

随着JS越来越庞大,已经不仅仅是以前复制粘贴做特效的时代了,JS越来越偏向于业务逻辑与应用。JS在web开发中占有越来越重要的地位。由于JS代码庞大,文件数目多,传统的使用<script src=""></script>会带来很多性能的问题,因此requirejs可以为我们提供两种解决思路:

1、模块化组织JS;(避免网页失去响应)

2、异步加载JS文件;(便于代码的编写和维护)

核心文件 require.js和config.js(JS统一入口配置文件);

引用

<script src="/public/require.js" data-main="/public/main"></script>

data-main:配置文件入口(类似java中的main函数);data-*** 是HTML5规范中新增的html元素属性;

配置文件示例:

require.config({
baseUrl:"/public/jsFrame/",“根路径”

paths: {
"Main": 'Home/main/mainIndex'  “模块名称:路径”
},
map: {
'*': {
'css': 'bower/require-css/css',“优先加载”
},
},

shim: {“加载非AMD方式的JS文件代码”

'Page': {
deps:[
'css!/public/Css/Home' “代码加载依赖”
]
}
},

urlArgs: 't=随机数(解决业务JS代码的缓存问题)' //增加版本,解决js缓存
});

1、模块化文件,一般是一个功能是一个文件。文件的名字,就是上面requireconfig中配置的模块名字。require加载文件时,会自动加上.js后缀。

2、当某些模块依赖其他模块时,可以通过define([xxx],function(xxx){yyy});的方式添加依赖关系,require会在异步加载后,自动调整次序。

define是定义js模块,require是运行脚本;

require.js加载的模块,采用AMD规范。也就是说,模块必须按照AMD的规定来写。

具体来说,就是模块必须采用特定的define()函数来定义。如果一个模块不依赖其他模块,那么可以直接定义在define()函数之中。

 例如:require(['moduleA', 'moduleB', 'moduleC'], function (moduleA, moduleB, moduleC){

    // some code here

  });

require()函数接受两个参数。第一个参数是一个数组,表示所依赖的模块,上例就是['moduleA', 'moduleB', 'moduleC'],即主模块依赖这三个模块;第二个参数是一个回调函数,当前面指定的模块都加载成功后,它将被调用。加载的模块会以参数形式传入该函数,从而在回调函数内部就可以使用这些模块。

require.js会先加载moduleA、moduleB和moduleC,然后再运行回调函数

requirejs学习之路的更多相关文章

  1. jQuery学习之路(1)-选择器

    ▓▓▓▓▓▓ 大致介绍 终于开始了我的jQuery学习之路!感觉不能再拖了,要边学习原生JavaScript边学习jQuery jQuery是什么? jQuery是一个快速.简洁的JavaScript ...

  2. Android开发学习之路-RecyclerView滑动删除和拖动排序

    Android开发学习之路-RecyclerView使用初探 Android开发学习之路-RecyclerView的Item自定义动画及DefaultItemAnimator源码分析 Android开 ...

  3. RPC远程过程调用学习之路(一):用最原始代码还原PRC框架

    RPC: Remote Procedure Call 远程过程调用,即业务的具体实现不是在自己系统中,需要从其他系统中进行调用实现,所以在系统间进行数据交互时经常使用. rpc的实现方式有很多,可以通 ...

  4. webService学习之路(三):springMVC集成CXF后调用已知的wsdl接口

    webService学习之路一:讲解了通过传统方式怎么发布及调用webservice webService学习之路二:讲解了SpringMVC和CXF的集成及快速发布webservice 本篇文章将讲 ...

  5. [精品书单] C#/.NET 学习之路——从入门到放弃

    C#/.NET 学习之路--从入门到放弃 此系列只包含 C#/CLR 学习,不包含应用框架(ASP.NET , WPF , WCF 等)及架构设计学习书籍和资料. C# 入门 <C# 本质论&g ...

  6. Redis——学习之路四(初识主从配置)

    首先我们配置一台master服务器,两台slave服务器.master服务器配置就是默认配置 端口为6379,添加就一个密码CeshiPassword,然后启动master服务器. 两台slave服务 ...

  7. Redis——学习之路三(初识redis config配置)

    我们先看看config 默认情况下系统是怎么配置的.在命令行中输入 config get *(如图) 默认情况下有61配置信息,每一个命令占两行,第一行为配置名称信息,第二行为配置的具体信息.     ...

  8. Redis——学习之路二(初识redis服务器命令)

    上一章我们已经知道了如果启动redis服务器,现在我们来学习一下,以及如何用客户端连接服务器.接下来我们来学习一下查看操作服务器的命令. 服务器命令: 1.info——当前redis服务器信息   s ...

  9. 踏上Salesforce的学习之路(一)

    相信通过前面的学习,大家已经拥有了一个属于自己的Salesforce开发者账号,下面,我们将用这个账号正式踏上Salesforce的学习之路. 首先,点击网址:https://developer.sa ...

随机推荐

  1. 养只爬虫当宠物(Node.js爬虫爬取58同城租房信息)

    先上一个源代码吧. https://github.com/answershuto/Rental 欢迎指导交流. 效果图 搭建Node.js环境及启动服务 安装node以及npm,用express模块启 ...

  2. javascript的封装实例

    StringBuffer方法的js自定义封装: <!doctype html><html lang="en"> <head> <meta ...

  3. iOS中发送HTTP请求的方案

    在iOS中,常见的发送HTTP请求的方案有 苹果原生(自带) NSURLConnection:用法简单,最古老最经典的一种方案 NSURLSession:功能比NSURLConnection更加强大, ...

  4. 关于破解IDEA

    博客的意义就在于分享 哈哈 今天想装个 IDEA玩玩 去官网 下了个 安装包 想破解 结果度娘 帮解决了 直接po方法 很简单 就是安装好注册的时候 选择 License server ,填 http ...

  5. Objective-C之Block

    Block基本概念 本小节知识点: [了解]什么是Block [理解]block的格式 1.什么是Block Block是iOS中一种比较特殊的数据类型 Block是苹果官方特别推荐使用的数据类型, ...

  6. 快捷下载 sourceForge下的资源

    一些开源项目通常会放在  sourceforge.net下面发布.然而,这个网站有时候出现卡顿,并且需要点击几次页面才能下载到自己想要的资源. 这里有个好办法,一步列出所有可下载的资源:        ...

  7. Effective Java 03 Enforce the singleton property with a private constructor or an enum type

    Principle When implement the singleton pattern please decorate the INSTANCE field with "static ...

  8. JavaScript Patterns 2.10 Naming Conventions

    1. Capitalizing Constructors var adam = new Person(); 2. Separating Words camel case - type the word ...

  9. C#拖放实现餐饮系统转台操作

    转台是餐饮系统中常用的操作,一般系统都是右键选择弹出目标台界面,然后选择目标台确定,现在我们把需要转的台通过拖动到目标台图标上面就可以实现前面的操作,简单快捷. 转台操作时: 转台成功后: /// & ...

  10. python模块调用

    1.某个模块1被调用到另一个模块2的时候,当不想模块1中的某些代码在模块2中执行时,可以在模块一种添加如下代码: if    __name__  ==     "__main__" ...