sea.js模块化编程
* 为什么要模块化?
- 解决文件依赖
- 解决命名冲突
* JS中模块的定义
通常,我们可以这样定义一个模块。
利用闭包特性定义一个模块,对全局暴露一个变量,外部不能访问模块内部定义的变量和方法。
立即执行函数,闭包
var myModule = (function(){
var var1 = 1;
var var2 = 2;
function fn1(){
}
function fn2(){
}
return {
fn1: fn1,
fn2: fn2
};
})();
node.js中的模块化
node中模块的引入是同步的,遵循CommonJS规范。
sea.js
遵循CMD (通用模块定义) ,对于依赖的模块,就近依赖,延迟执行。
sea.js写法
define(function(require,exports,module){
var a = require('./a')
a.todo()
//***省略100行
var b = require('./b') //依赖就近书写
b.todo()
//.....
})
define定义模块
define函数用来定义模块
define(factory) factory为模块的构造方法
define(function(require,exports,module){
// 模块代码
});
define(id?,deps?,factiory)
id表示模块标识,数组deps是模块依赖,两个参数都可以省略,可以通过构建工具自动生成。
修改jquery为CMD模块
define.cmd Object 一个空对象,可用来判定当前页面是否有 CMD 模块加载器:
对于非seajs模块化的类库,我们可以手动定义它,通过define的cmd规范定义就可以正常使用了
if (typeof define === 'function' && define.cmd) {
define(function (require, exports, module) {
module.exports = jQuery;
})
暴露接口
exports
module.exports
return
一定不能为exports赋值对象,因为exports仅仅是module.exports的一个引用
define(function(require,exports){
// 第一种
exports.foo = 'bar';
exports.do = function(){}
//第二种
return {
foo : 'bar',
do : function(){}
};
//第三种
module.exports = {
foo : 'bar',
do : function(){};
}
});
启动
<script type="text/javascript" src="sea.js"></script>
<script>
seajs.use('main/main') //这个文件会第一个被sea.js加载
</script>
sea.js模块化编程的更多相关文章
- 从273二手车的M站点初探js模块化编程
前言 这几天在看273M站点时被他们的页面交互方式所吸引,他们的首页是采用三次加载+分页的方式.也就说分为大分页和小分页两种交互.大分页就是通过分页按钮来操作,小分页是通过下拉(向下滑动)时异步加载数 ...
- require.js实现js模块化编程(一)
1.认识require.js: 官方文档:http://requirejs.org/RequireJS是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一.最新版本的Requ ...
- require.js实现js模块化编程(二):RequireJS Optimizer
require.js实现js模块化编程(二):RequireJS Optimizer 这一节,我们主要学习一下require.js所提供的一个优化工具r.js的用法. 1.认识RequireJS Op ...
- 初步理解require.js模块化编程
初步理解require.js模块化编程 一.Javascript模块化编程 目前,通行的Javascript模块规范共有两种:CommonJS和AMD. 1.commonjs 2009年,美国程序员R ...
- [转]js模块化编程之彻底弄懂CommonJS和AMD/CMD!
原文: https://www.cnblogs.com/chenguangliang/p/5856701.html ------------------------------------------ ...
- JS模块化编程之加载器原理
世面上有好多JavaScript的加载器,比如 sea.js, require.js, yui loader, labJs...., 加载器的使用范围是一些比较大的项目, 个人感觉如果是小项目的话可以 ...
- js模块化编程总结
大家都知道,js中的变量(variable)有其作用范围,比如:函数里用var定义的变量在函数外是看不到的,而定义在函数外面的变量(不能有没有var修饰)均是全局变量,在js程序的任何位置都可以访问. ...
- js模块化编程之彻底弄懂CommonJS和AMD/CMD!
先回答我:为什么模块很重要? 答:因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块.但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写 ...
- 好文推荐系列-------(5)js模块化编程
本文主要来源于阮一峰的<Javascript模块化编程>系列文章整合,原文地址:http://www.ruanyifeng.com/blog/2012/10/javascript_modu ...
随机推荐
- NOT IN 和NOT EXISTS
今天写了一个简单的NOT IN语句,结果跟预期大相径庭,百度之发现深坑一个,遂录之. 登陆账户表logins code name status a admin N b guest N c member ...
- Linux 权限设置chmod
Linux中设置权限,一般用chmod命令 1.介绍 权限设置chmod 功能:改变权限命令.常用参数: 1=x(执行权execute) 2=w(写权write) 4=r(读权Read) setuid ...
- TCP通信
//网络套接字编程实例,服务器端,TCP通信. #include <WinSock2.h> #pragma comment(lib,"ws2_32.lib") #inc ...
- 学习笔记 :DrawText
最近在做一个TStringGrid的自绘处理,在画文字处理上遇到了高度的计算问题.后来经过一段时间还是找到了一些方法: 1.使用TLabel 这个方法是有点绕路的,方法倒是简单,就是使用AutoSiz ...
- 超炫的HTML5粒子效果进度条 VS 如何规范而优雅地code
最近瞎逛的时候发现了一个超炫的粒子进度效果,有多炫呢?请擦亮眼镜! // _this.ch){ _this.particles.splice(i, 1); } }; this.Particle.p ...
- ABP框架 - 日志
文档目录 本节内容: 服务端 获取Logger(记录器) Logger的基类 配置 Abp.Castle.Log4Net 包 客户端 服务端 ABP使用Castle Windsor的日志记录工具,它可 ...
- Entity Framework 6 Recipes 2nd Edition(10-10)译 - > 为TPH继承的插入、更新、删除操作映射到存储过程
10-10. 为TPH继承的插入.更新.删除操作映射到存储过程 问题 TPH继承模型,想把它的插入.修改.删除操作映射到存储过程 Solution 假设数据库有一个描述不同种类的产品表(Product ...
- T-sql语句查询执行顺序
前言 数据库的查询执行,毋庸置疑是程序员必备技能之一,然而数据库查询执行的过程绚烂多彩,却是很少被人了解,今天哥哥要带你装逼带你飞,深入一下这sql查询的来龙去脉,为查询的性能优化处理打个基础,或许面 ...
- 用枚举enum替代int常量
枚举的好处: 1. 类型安全性 2.使用方便性 public class EnumDemo { enum Color{ RED(3),BLUE(5),BLACK(8),YELLOW(13),GREEN ...
- (转)ubuntu apache2 的负载均衡和反向代理
apache功能其实很是强大,最近一段时间研究了下apache的反向代理和负载均衡,反向代理网协的外网出口和我的博客出口就是通过apache的反向代理实现的,总结一下,重点说说负载均衡的配置. 首先说 ...
- 解决文件依赖
- 解决命名冲突
立即执行函数,闭包var myModule = (function(){var var1 = 1;var var2 = 2;function fn1(){}function fn2(){}return {fn1: fn1,fn2: fn2};})();
define(function(require,exports,module){var a = require('./a')a.todo()//***省略100行var b = require('./b') //依赖就近书写b.todo()//.....})
define(function(require,exports,module){// 模块代码});
if (typeof define === 'function' && define.cmd) {define(function (require, exports, module) {module.exports = jQuery;})
一定不能为exports赋值对象,因为exports仅仅是module.exports的一个引用
define(function(require,exports){// 第一种exports.foo = 'bar';exports.do = function(){}//第二种return {foo : 'bar',do : function(){}};//第三种module.exports = {foo : 'bar',do : function(){};}});
启动
<script type="text/javascript" src="sea.js"></script><script>seajs.use('main/main') //这个文件会第一个被sea.js加载</script>
前言 这几天在看273M站点时被他们的页面交互方式所吸引,他们的首页是采用三次加载+分页的方式.也就说分为大分页和小分页两种交互.大分页就是通过分页按钮来操作,小分页是通过下拉(向下滑动)时异步加载数 ...
1.认识require.js: 官方文档:http://requirejs.org/RequireJS是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一.最新版本的Requ ...
require.js实现js模块化编程(二):RequireJS Optimizer 这一节,我们主要学习一下require.js所提供的一个优化工具r.js的用法. 1.认识RequireJS Op ...
初步理解require.js模块化编程 一.Javascript模块化编程 目前,通行的Javascript模块规范共有两种:CommonJS和AMD. 1.commonjs 2009年,美国程序员R ...
原文: https://www.cnblogs.com/chenguangliang/p/5856701.html ------------------------------------------ ...
世面上有好多JavaScript的加载器,比如 sea.js, require.js, yui loader, labJs...., 加载器的使用范围是一些比较大的项目, 个人感觉如果是小项目的话可以 ...
大家都知道,js中的变量(variable)有其作用范围,比如:函数里用var定义的变量在函数外是看不到的,而定义在函数外面的变量(不能有没有var修饰)均是全局变量,在js程序的任何位置都可以访问. ...
先回答我:为什么模块很重要? 答:因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块.但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写 ...
本文主要来源于阮一峰的<Javascript模块化编程>系列文章整合,原文地址:http://www.ruanyifeng.com/blog/2012/10/javascript_modu ...
今天写了一个简单的NOT IN语句,结果跟预期大相径庭,百度之发现深坑一个,遂录之. 登陆账户表logins code name status a admin N b guest N c member ...
Linux中设置权限,一般用chmod命令 1.介绍 权限设置chmod 功能:改变权限命令.常用参数: 1=x(执行权execute) 2=w(写权write) 4=r(读权Read) setuid ...
//网络套接字编程实例,服务器端,TCP通信. #include <WinSock2.h> #pragma comment(lib,"ws2_32.lib") #inc ...
最近在做一个TStringGrid的自绘处理,在画文字处理上遇到了高度的计算问题.后来经过一段时间还是找到了一些方法: 1.使用TLabel 这个方法是有点绕路的,方法倒是简单,就是使用AutoSiz ...
最近瞎逛的时候发现了一个超炫的粒子进度效果,有多炫呢?请擦亮眼镜! // _this.ch){ _this.particles.splice(i, 1); } }; this.Particle.p ...
文档目录 本节内容: 服务端 获取Logger(记录器) Logger的基类 配置 Abp.Castle.Log4Net 包 客户端 服务端 ABP使用Castle Windsor的日志记录工具,它可 ...
10-10. 为TPH继承的插入.更新.删除操作映射到存储过程 问题 TPH继承模型,想把它的插入.修改.删除操作映射到存储过程 Solution 假设数据库有一个描述不同种类的产品表(Product ...
前言 数据库的查询执行,毋庸置疑是程序员必备技能之一,然而数据库查询执行的过程绚烂多彩,却是很少被人了解,今天哥哥要带你装逼带你飞,深入一下这sql查询的来龙去脉,为查询的性能优化处理打个基础,或许面 ...
枚举的好处: 1. 类型安全性 2.使用方便性 public class EnumDemo { enum Color{ RED(3),BLUE(5),BLACK(8),YELLOW(13),GREEN ...
apache功能其实很是强大,最近一段时间研究了下apache的反向代理和负载均衡,反向代理网协的外网出口和我的博客出口就是通过apache的反向代理实现的,总结一下,重点说说负载均衡的配置. 首先说 ...