requirejs是异步执行

为什么会出现模块化
1.不定什么时候,自己就将全局变量改变了
2.函数名的冲突
3.依赖关系不好管理
如果b.js依赖a.js那么b必须放在a的下面
解决的办法
1.自执行函数来包装代码
mod=function(){
    var a,b;
    return {
        add:function(){
            a+b+s;
        },
        form:function(){
        }
    }
}();
2.jquery风格的匿名自执行函数
(function(window){
})(window);

最后模块化形成是
AMD
a.js
define(function(){
});
b.js
define(function(){
});
main.js
require(['a','b'],function(a,b){    
这种执行转态会将b提前预加载一遍,当前提有多个js文件的时候,就都要全部预加载一遍,所以这个的效率不是很好。
解决的办法是:
define(function(){
    require(['a',function(a){
     a.hello();
    }]);
    $("#b").click(function(){
        require(['b'],function(b){
            b.hello();
        });
    });
});
AMD叫做异步模块定义
require.js语法
define(id,dependencies,factory);
id可选的参数 用来定于模块的标识
dependencies当前模块依赖的模块名称数组
factory模块化初始化要执行函数或者对象

在页面中使用require函数加载模块
require([dependencies],function(){})

AMD推崇依赖前置,在定义模块的时候就要声明其依赖的模块
1.定义无依赖的模块
define(function(){
});
require.config({//定义路径
    baseurl:"script/lib",
    paths:{
    }
});
require(["app/"],function(){
});
2.定义有依赖的模块
define(['a'],function(a){})
require.config({
});
require(["app/"],function(){
});
一些总结和一个demo地址:https://github.com/GainLoss/summary/tree/master/%E5%81%8F%E5%83%BB%E7%9A%84%E7%9F%A5%E8%AF%86/%E6%A8%A1%E5%9D%97%E5%8C%96

javascript模块化---requirejs的更多相关文章

  1. JavaScript模块化-RequireJs实现AMD规范的简单例子

    AMD规范简介 AMD(异步模块定义),是实现JavaScript模块化规范之一,它采用异步方式加载模块,模块的加载不影响后面语句的运行.require.js和curl.js都是实现AMD规范的优秀加 ...

  2. Javascript模块化开发,使用模块化脚本加载工具RequireJS,提高你代码的速度和质量。

    随着前端JavaScript代码越来越重,如何组织JavaScript代码变得非常重要,好的组织方式,可以让别人和自己很好的理解代码,也便于维护和测试.模块化是一种非常好的代码组织方式,本文试着对Ja ...

  3. JavaScript模块化编程之AMD - requireJS基础使用

    JavaScript模块化编程之AMD requireJS基础使用 标签(空格分隔): JavaScript 参考文章 AMD规范 AMD是"Asynchronous Module Defi ...

  4. Javascript模块化规范

    Javascript模块化规范 一.前端js模块化由来与演变 CommonJS 原来叫 ServerJS,推出 Modules/1.0 规范后,在 Node.js 等环境下取得了很不错的实践.09年下 ...

  5. Javascript 模块化开发上线解决方案

    最近又换部门了,好频繁地说...于是把这段时间搞的小工具们简单整理了一下,作了一个小的总结.这次用一个简单业务demo来向大家介绍一下Javascript模块化开发的方式和自动化合并压缩的一些自己的处 ...

  6. 该如何理解AMD ,CMD,CommonJS规范--javascript模块化加载学习总结

    是一篇关于javascript模块化AMD,CMD,CommonJS的学习总结,作为记录也给同样对三种方式有疑问的童鞋们,有不对或者偏差之处,望各位大神指出,不胜感激. 本篇默认读者大概知道requi ...

  7. JavaScript模块化---AMD规范

    JavaSript模块化 在了解AMD,CMD规范前,还是需要先来简单地了解下什么是模块化,模块化开发?     模块化是指在解决某一个复杂问题或者一系列的杂糅问题时,依照一种分类的思维把问 题进行系 ...

  8. 实现一个JavaScript模块化加载器

    对任何程序,都存在一个规模的问题,起初我们使用函数来组织不同的模块,但是随着应用规模的不断变大,简单的重构函数并不能顺利的解决问题.尤其对JavaScript程序而言,模块化有助于解决我们在前端开发中 ...

  9. JavaScript模块化开发&&模块规范

    在做项目的过程中通常会有一些可复用的通用性功能,之前的做法是把这个功能抽取出来独立为一个函数统一放到commonFunctions.js里面(捂脸),实现类似于snippets的代码片段收集. fun ...

随机推荐

  1. 《Linux内核设计与实现》读书笔记(一)-内核简介

    本篇简单介绍内核相关的基本概念. 主要内容: 单内核和微内核 内核版本号 1. 单内核和微内核   原理 优势 劣势 单内核 整个内核都在一个大内核地址空间上运行. 1. 简单.2. 高效:所有内核都 ...

  2. RedisUtil(未完,持续更新中....)

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  3. 【并发编程】Future模式添加Callback及Promise 模式

    Future Future是Java5增加的类,它用来描述一个异步计算的结果.你可以使用 isDone 方法检查计算是否完成,或者使用 get 方法阻塞住调用线程,直到计算完成返回结果.你也可以使用  ...

  4. 2019前端面试之html5

    html5新增特性 语义化标签 表单新特性 视频和音频canva画布 svg画图 地理位置 为鼠标提供的拖放api webwroker storage websocker 常见块级标签 div,p,h ...

  5. MySql中存储过程的理解

    到底什么是存储过程,又为什么需要使用存储过程? 存储过程简单来说,就是为以后的使用而保存的一条或多条MySQL语句的集合,可将其视为批文件,虽然它们的作用不仅限与批处理. 使用存储过程有3个主要的好处 ...

  6. 基于XML的AOP配置

    创建spring的配置文件并导入约束 此处要导入aop的约束 <?xml version="1.0" encoding="UTF-8"?> < ...

  7. hdu6070(分数规划/二分+线段树区间更新,区间最值)

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=6070 题意: 给出一个题目提交序列, 从中选出一个正确率最小的子串. 选中的子串中每个题目当且仅当最 ...

  8. Centos下搭建nginx反向代理

    上一节已经用编译的方式搭建好了一个nginx,链接在下面 https://www.toutiao.com/i6693130510777975300/ 然后这次我们把上次搭建好的nginx作为反向代理的 ...

  9. 低价购买 dp

    题目描述 “低价购买”这条建议是在奶牛股票市场取得成功的一半规则.要想被认为是伟大的投资者,你必须遵循以下的问题建议:“低价购买:再低价购买”.每次你购买一支股票,你必须用低于你上次购买它的价格购买它 ...

  10. 如何使用JMETER从JSON响应中提取数据

    如果你在这里,可能是因为你需要使用JMeter从Json响应中提取变量. 好消息!您正在掌握掌握JMeter Json Extractor的权威指南.作为Rest API测试指南的补充,您将学习掌握J ...