requireJS模块化
1. JavaScript里面js代码的写法:目标是解决冲突和依赖
函数式编程,全局函数和变量--很容易覆盖
对象的写法--也会从外面改变
命名空间:利用名称不同缓冲js代码的冲突---名称太长,不方便维护
闭包--变量一直存在,垃圾回收机制失效,内存泄漏
模块化开发
函数式编程---->面向对象编码---->模块化编程(面向对象可以理解成深度的模块化)
2.COMMONJS规范、AMD规范、CMD规范
CommonJS 最开始是 Mozilla 的工程师于 2009 年开始的一个项目,它的目的是让浏览器之外的 JavaScript
能够通过模块化的方式来开发和协作---Node.js(服务器端)
CommonJS是最早的规范。
CommonJS 的规范中,每个 JavaScript 文件就是一个独立的模块.
CommonJS 规范的主要适用场景是服务器端编程,所以采用同步加载模块的策略。
定义模块
调用模块
配置模块
AMD 是 Asynchronous Module Definition 的简称,即“异步模块定义”,是从 CommonJS 讨论中诞生的。
AMD 优先照顾浏览器的模块加载场景,使用了异步加载和回调的方式。浏览器端异步加载库Require.js实
现的就是AMD规范。
CMD规范,全称”Common Module Definition”,称为 通用模块加载规范 。一般也是用在浏览器端。浏览器
端异步加载库Sea.js实现的就是CMD规范。
3.RequireJS模块化开发
模块化的思想和意义--冲突和依赖
可以更方便地使用别人的代码,想要什么功能,就加载什么模块(每个 JavaScript 文件就是一个独立的模块)
团队开发大家必须以同样的方式编写模块,否则达不到预想的效果.
模块化思想就是指将页面根据内容的关联性分解成不同的且相互独立的模块进行开发,每个模块之间没有必然的联系,互不影响。
4.requireJS模块化开发步骤
下载并引入requirejs文件
async属性表明这个文件需要异步加载,避免网页失去响应。IE不支持这个属性,只支持 defer,所以把defer也写上。
data-main属性的作用是,指定网页程序的主模块,意思是整个网页的入口代码,所有代码都从这儿开始运行,文件名自定义
define 定义模块,接收二个参数。
第1个参数,必须是一个数组,指明该模块的依赖性
第2个参数是一个回调函数。
require 调用模块,接收二个参数。
第1个参数是一个数组,表示所依赖的模块
第2个参数是一个回调函数,当前面指定的模块都加载成功后,它将被调用。
require.config({ }) 配置模块 第三方的公共模块
5.ES6 模块化讲解 (import export)
ES6 模块的设计思想是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量。CommonJS 和 AMD 模块,都只能在运行时确定这些东西。
export命令用于规定模块的对外接口。
import命令用于输入其他模块提供的功能。
定义模块/导入模块/引入模块文件
requireJS模块化的更多相关文章
- RequireJS模块化后JS压缩合并
使用RequireJS模块化后代码被拆分成多个JS文件了,在部署生产环境需要压缩合并,RequireJS提供了一个打包压缩工具r.js来对模块进行合并压缩.r.js非常强大,不但可以压缩js,css, ...
- angularjs backbone 集成requirejs 模块化
首先认识requirejs requirejs是个包加载器,核心功能是模块化管理,可以实现按需加载. 重点是明白 模块化不是按需加载. 模块化的意义: 是通过代码逻辑表明模块之间的依赖关系和执行顺序, ...
- RequireJS 模块化加载框架使用
RequireJS 是一个遵循 AMD 规范的模块化加载框架 与上文seajs一样,这里简单介绍其相关用法 同样的,首先是下载好 require.js --> http://requirejs. ...
- [工具配置]使用requirejs模块化开发多页面一个入口js的使用方式
描述 知道requirejs的都知道,每一个页面需要进行模块化开发都得有一个入口js文件进行模块配置.但是现在就有一个很尴尬的问题,如果页面很多的话,那么这个data-main对应的入口文件就会很多. ...
- RequireJS模块化编程详解
1.模块的写法 模块化编程一般都有这么几个过渡过程,如下描述. 原始方法 function m1(){ //... } function m2(){ //... } 上面的函数m1()和m2(),组成 ...
- seaj和requirejs模块化的简单案例
如今,webpack.gulp等构件工具流行,有人说seajs.requirejs等纯前端的模块化工具已经被淘汰了,我不这么认为,毕竟纯前端领域想要实现模块化就官方来讲,还是有一段路要走的.也因此纯前 ...
- 使用requirejs模块化开发多页面一个入口js的使用方式
描述 知道requirejs的都知道,每一个页面需要进行模块化开发都得有一个入口js文件进行模块配置.但是现在就有一个很尴尬的问题,如果页面很多的话,那么这个data-main对应的入口文件就会很多. ...
- RequireJS模块化之循环依赖
如果你定义一个循环依赖关系 (a 依赖b 并且 b 依赖 a),那么当b的模块构造函数被调用的时候,传递给他的a会是undefined. 但是b可以在a模块在被引入之后通过require(‘a’)来获 ...
- requirejs模块化框架用法分享
我采用的是一个非常流行的库require.js. 一.为什么要用require.js? 最早的时候,所有Javascript代码都写在一个文件里面,只要加载这一个文件就够了.后来,代码越来越多,一 ...
随机推荐
- 9、AutoResponder返回本地数据(mock)
前言 mock可以说是面试必问的话题的,我第一次接触mock的时候也是一脸懵逼.虽然fiddler工具用了很久,里面的打断点,设置自动返回数据功能都用过.mock说的通俗一点就是模拟返回数据,只是面试 ...
- clickhouse入门到实战及面试
第一章. clickhouse入门 一.ClickHouse介绍 ClickHouse(开源)是一个面向列的数据库管理系统(DBMS),用于在线分析处理查询(OLAP). 关键词:开源.面向列.联机分 ...
- Docker 部署Spring Boot 项目并连接mysql、redis容器(记录过程)
Spring Boot 项目配置 将写好的Spring Boot 项目通过maven 进行package打包获得可执行Jar 再src/main/docker(放哪都行)下编写创建Dockerfile ...
- ReactNavigation中如何实现页面跳转
一.ReactNavigation中如何实现页面跳转 因为每个屏幕组件(具有路由地址的组件)都是由App根组件自动创建并挂载的,App组件 在创建屏幕组件时,会自动传递进来一个props: nav ...
- PAT-1133 Splitting A Linked List(链表分解)
Cutting an integer means to cut a K digits long integer Z into two integers of (K/2) digits long int ...
- Java——线程安全的集合
线程安全的集合 java.util.concurrent包:ConcurrentHashMap,ConcurrentSkipListMap,ConcurrentSkipListSet,Concu ...
- js 遍历删除数组
$(function(){ var aa = [1,1,2,3,3,4,4,5]; alert(aa); for (var i = aa.length-1;i >= 0 ;i--) { if ( ...
- Linux下VCS2014和Verdi2015的联合使用
VCS和Verdi是IC设计中常用的两款开发工具.VCS是Synopsys公司的产品,和大家所熟知的ModeSim一样的都是EDA仿真工具.Verdi是Nocas公司(已经被Synopsys公司收购) ...
- Mybaties 的缓存
1.mybaties 默认会话是一级缓存,没有开启二级缓存.开启方式在mapper文件中设置<cache /> 2.<cache eviction="LRU" f ...
- excel导入mysql数据
excel加载mysql数据 1.第一步,选择从mysql导入数据 2.单击会出现弹框: 3.可能有的同学的,这里缺少插件,例如: 4.去下载 这个 插件安装即可.https://dev.mysql. ...