1. require和define的区别

The require() function is used to run immediate functionalities, while define() is used to define modules for use in multiple locations.

  • require()——用于一次性定义的语句或模块,或立即执行的语句或模块
  • define()—— 用于可以重用的模块,可以放在不同的地方

2. 管理依赖文件的载入顺序——Managing the Order of Dependent Files

RequireJS uses Asynchronous Module Loading (AMD) for loading files. Each dependent module will start loading through asynchronous requests in the given order. Even though the file order is considered, we cannot guarantee that the first file is loaded before the second file due to the asynchronous nature. So, RequireJS allows us to use the shim config to define the sequence of files which need to be loaded in correct order. Let’s see how we can create configuration options in RequireJS.

RequireJS使用异步模块载入机制(AMD),即每个独立模块都是通过异步请求载入,就是说无法保证第一个文件在第二个文件之前先行载入,为此,RequireJS使用shim来强制定义文件载入的顺序,如以下代码:

requirejs.config({
shim: {
'source1': ['dependency1','dependency2'],
'source2': ['source1']
}
});

Under normal circumstances these four files will start loading in the given order. Here, source2 depends on source1. So, once source1 has finished loading, source2 will think that all the dependencies are loaded. However, dependency1 and dependency2 may still be loading. Using the shim config, it is mandatory to load the dependencies before source1. Hence, errors will not be generated.

上述定义表示: source2依赖于source1,只有source1完成载入后才载入source2;source1依赖于dependency1和dependency2,只有dependency1和dependency2完成载入后才载入source1,故整个载入顺序为:

dependency1,dependency2(没有规定该两个文件的载入顺序)--> source1 --> source2

define(["dependency1","dependency2","source1","source2"], function() {

);

RequireJS使用小结1——for Effective JavaScript Module Loading的更多相关文章

  1. Understanding RequireJS for Effective JavaScript Module Loading

    Modular programming is used to break large applications into smaller blocks of manageable code. Modu ...

  2. 小王子浅读Effective javascript(一)了解javascript版本

    哈哈,各位园友新年快乐!愚安好久没在园子里写东西了,这次决定针对javascript做一个系列,叫做<小王子浅读Effective javascript>,主要是按照David Herma ...

  3. javascript module system all in one

    javascript module system all in one AMD & CMD https://github.com/amdjs/amdjs-api/wiki/AMD http:/ ...

  4. JavaScript Module Pattern: In-Depth

    2010-03-12 JavaScript Module Pattern: In-Depth The module pattern is a common JavaScript coding patt ...

  5. [Effective JavaScript 笔记] 第4条:原始类型优于封闭对象

    js有5种原始值类型:布尔值.数字.字符串.null和undefined. 用typeof检测一下: typeof true; //"boolean" typeof 2; //&q ...

  6. [Effective JavaScript 笔记] 第5条:避免对混合类型使用==运算符

    “1.0e0”=={valueOf:function(){return true;}} 是值是多少? 这两个完全不同的值使用==运算符是相等的.为什么呢?请看<[Effective JavaSc ...

  7. [Effective JavaScript 笔记]第3章:使用函数--个人总结

    前言 这一章把平时会用到,但不会深究的知识点,分开细化地讲解了.里面很多内容在高3等基础内容里,也有很多讲到.但由于本身书籍的篇幅较大,很容易忽视对应的小知识点.这章里的许多小提示都很有帮助,特别是在 ...

  8. [Effective JavaScript 笔记]第27条:使用闭包而不是字符串来封装代码

    函数是一种将代码作为数据结构存储的便利方式,代码之后可以被执行.这使得富有表现力的高阶函数抽象如map和forEach成为可能.它也是js异步I/O方法的核心.与此同时,也可以将代码表示为字符串的形式 ...

  9. [Effective JavaScript 笔记]第28条:不要信赖函数对象的toString方法

    js函数有一个非凡的特性,即将其源代码重现为字符串的能力. (function(x){ return x+1 }).toString();//"function (x){ return x+ ...

随机推荐

  1. TextBoxes 与 TextBoxes ++

    TextBoxes 论文关键idea 本文和SegLink一样,也是在SSD的基础上进行改进的.相比SSD做了以下的改进: 修改了default box的apect ratio,分别为[1 2 3 5 ...

  2. scratch资源

    火柴人工作室:https://scratch.mit.edu/studios/170355/ 像素工作室:https://scratch.mit.edu/studios/3667398/ snap官网 ...

  3. 教你如何写thinkphp多表查询语句

    1.table()函数 thinkphp中提供了一个table()函数,具体用法参考以下语句: $list=$Demo->table('think_blog blog,think_type ty ...

  4. C#修改GIF大小同时保持GIF仍然可动和背景透明

    /// <summary> /// 设置GIF大小 /// </summary> /// <param name="path">图片路径< ...

  5. MySQL常见的库操作,表操作,数据操作集锦及一些注意事项

    一 库操作(文件夹) 1 数据库命名规则 可以由字母.数字.下划线.@.#.$ 区分大小写 唯一性 不能使用关键字如 create select 不能单独使用数字 最长128位 2 数据库相关操作 创 ...

  6. Date函数基础知识整理

    Date类型:1.Date.parse()接收一个表示日期的字符串参数,然后再根据这个字符串返回响应的日期的毫秒数:如:创建一个日期: <script> // var someDate=n ...

  7. HttpClient 教程 (四)

    第四章 HTTP认证 HttpClient提供对由HTTP标准规范定义的认证模式的完全支持.HttpClient的认证框架可以扩展支持非标准的认证模式,比如NTLM和SPNEGO. 4.1 用户凭证 ...

  8. Shell执行将脚本里的变量打印到指定日志文件

    首先需要定位获取任务的运行日志或者报错信息,才能定位问题. 通过shell调用有些脚本的话,日志信息会打印在shell里.不过也有用户在shell里调用正常,但是到crontab调用的时候就出错并且没 ...

  9. 使用 esxtop 识别存储性能问题

    可以使用交互式 esxtop 实用程序提供连接到 VMware ESX 主机的各种设备的 I/O 衡量指标. 使用 esxtop 配置监控 要监控每个 HBA 的存储性能,请执行以下操作: 通过在命令 ...

  10. 基于jQuery在线问卷答题系统代码

    分享一款基于jQuery在线问卷答题系统代码是一款实用的jQuery答题插件,点击下一题切换带有淡入淡出效果.实现的效果图如下: 在线预览   源码下载 实现的代码. html代码: <div ...