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. sublime text 3安装及使用

    Sublime Text 3中文版是一款跨平台代码编辑器(Code Editor)软件.Sublime Text 3既可以编写代码还可以编辑文本,是程序员必不可少的工具,相比之前的版本Sublime ...

  2. AIM Tech Round 5 (rated, Div. 1 + Div. 2) D(SET,思维)

    #include<bits/stdc++.h>using namespace std;const long long mod = 1e9+7;char s[370007][27];long ...

  3. 创建、配置Servlet

    1.创建Servlet 2.选择继承的类及需要覆盖的方法 3.Servlet结构 package com.sysker.servlet; import java.io.IOException; imp ...

  4. 洛谷P1962 斐波那契数列

    传送门 不难得到状态转移矩阵 然后带进去乱搞 //minamoto #include<iostream> #include<cstdio> #include<cstrin ...

  5. tp5分页注意,分页生成的ul class是pagination,有些模板可能将pagination定义为display:none

    今天在调用分页时总是无法显示,查看网页源代码是正常的,后来发现是在css文件里将pagination定义为display:none,所以无法显示

  6. Vue中的指令(听博主说总结的很好)

    指令[重点] 作用:简化Dom操作 参考:https://cn.vuejs.org/v2/api/#%E6%8C%87%E4%BB%A4 特点: 1.都是以v-开头 2.除了插值表达式,其它都写在标签 ...

  7. :input获得焦点时被弹出键盘挡住解决办法

    这个是移动端非常常见的bug了,这里说下综合的解决办法,因为有时候你的办法就是会失效.. 上代码 /*input框调起输入法盖住输入问题*/$('input[type="text" ...

  8. 省选九省联考T2 IIIDX(线段树)

    题目传送门:https://www.luogu.org/problemnew/show/P4364 期中考后记:期中考刚考完,感觉不咋滴,年排第3.我抗压力太差了..期末得把rank1抢回来. 本来感 ...

  9. HQL和SQL

    hql是面向对象查询,格式:from + 类名 + 类对象 + where + 对象的属性 sql是面向数据库表查询,格式:from + 表名 + where + 表中字段 1.查询 一般在hiber ...

  10. (转)linux paste命令用法详解

    linux paste命令用法详解原文:http://www.xfcodes.com/linuxcmd/mulu/10211.htmlinux下paste命令,可用于合并文件的列. 功能说明:合并文件 ...