什么是OMD【访问 www.tangshuang.net 获取更多精彩内容】
未经授权，禁止复制转载。【转载请注明来源】【版权所有，侵权必究】本文作者：唐霜，转载请注明出处。在node.js流行起来之前，javas原创内容，盗版必究。【版权所有】唐霜 www.tangshuang.netcript的开发方式都是函数式的顺序依赖本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。关系，直到node.js火起来，Comm【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.netonJS规范被人推崇到一个高度。Comm本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】onJS其实首先提供了一个丰富的可扩展的【版权所有，侵权必究】【作者：唐霜】库，在此基础上提供可应用的API，在这些【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。API的基础上，逐渐形成一套规范，使得j【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。avascript的开发在这些规范的基础【作者：唐霜】本文版权归作者所有，未经授权不得转载。上进行。它的重要特征就是运行开发者模块化【原创不易，请尊重版权】【原创不易，请尊重版权】的开发javascript，就像Java本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net一样，提供一个模块，这个模块对外提供接口【作者：唐霜】【版权所有】唐霜 www.tangshuang.net，有一个入口去调动所有的模块协同完成不同【转载请注明来源】未经授权，禁止复制转载。的功能。node.js就是在此规范上建立【本文受版权保护】【本文受版权保护】起来的服务端框架。
本文作者：唐霜，转载请注明出处。【原创内容，转载请注明出处】原创内容，盗版必究。【原创内容，转载请注明出处】未经授权，禁止复制转载。node.js可以被认为是应用程序开发的【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。一个案例，它是运行在服务器上的javas【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。cript。而是否可以在浏览器上面也遵循【版权所有，侵权必究】【转载请注明来源】CommonJS规范呢？为了达到这个目的原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】，require.js火起来，与它对应的转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。是AMD规范。实际上，AMD规范是Com【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。monJS的一个兼容方案，require未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】.js希望建立一个既满足应用程序，又满足【原创不易，请尊重版权】【作者：唐霜】浏览器运行的规范。AMD也逐渐被开发者接本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。受，国外大部分的javascript发布转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】产品，基本上都遵循或支持amd规范。
本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net【转载请注明来源】sea.js是专注于浏览器的模块化jav著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。ascript开发框架，和前两者不同的是原创内容，盗版必究。未经授权，禁止复制转载。，它只专注于浏览器端，而且更优雅灵活，这本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】一规范被成为CMD规范，其创始人为中国的本文作者：唐霜，转载请注明出处。【原创内容，转载请注明出处】玉伯。自此，三家分立，各有裨益，java【版权所有，侵权必究】【版权所有，侵权必究】script的模块化开发规范已经被创立完【未经授权禁止转载】未经授权，禁止复制转载。毕，以后就将其逐渐完善，并实现更多的应用【作者：唐霜】【转载请注明来源】。
著作权归作者所有，禁止商业用途转载。【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net在此基础上，有人试图实现兼容。也就是自己【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。的代码既能在node.js上运行，也能在本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。符合amd规范的代码环境中运行。于是产生【本文受版权保护】【本文受版权保护】了umd，其实umd并不算规范，而只能算未经授权，禁止复制转载。【原创不易，请尊重版权】一种兼容方案，它可以兼容CommonJS【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】和AMD。但国内更多的其实是使用sea.原创内容，盗版必究。本文作者：唐霜，转载请注明出处。js，包括淘宝、腾讯的部分产品，都是使用【未经授权禁止转载】著作权归作者所有，禁止商业用途转载。sea.js框架，而react等的跑火，【版权所有】唐霜 www.tangshuang.net【作者：唐霜】有理由相信，未来的前端开发一定是模块化趋【作者：唐霜】【本文首发于唐霜的博客】势的。
【原创内容，转载请注明出处】原创内容，盗版必究。未经授权，禁止复制转载。【原创内容，转载请注明出处】就目前而言，为了能兼容commonjs 转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】amd cmd以及原生的javascri【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。pt，我结合了前人的经验，发布了omd，【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。它也不是什么规范，只是一套兼容方案罢了。
【访问 www.tangshuang.net 获取更多精彩内容】【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。【版权所有，侵权必究】omd的目的，就是希望所有的javasc【版权所有，侵权必究】未经授权，禁止复制转载。ript代码开发者都能按照这个规则来完成【本文首发于唐霜的博客】【关注微信公众号：wwwtangshuangnet】代码，使它在模块化开发环境下，可以作为一转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。个模块来使用，而在非模块环境下，也能够正著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。常使用。它就是一套兼容方案原创内容，盗版必究。，目前兼容的有module.export本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。s、amd、cmd以及原生支持。
【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。OMD的源码【本文受版权保护】
未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。【作者：唐霜】著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net首先，我需要将源码放出来，所有的读者可以【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。先简单的看下它的内容，大致了解它的运行规【作者：唐霜】【本文受版权保护】则。
原创内容，盗版必究。【本文受版权保护】【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。我已经更新了代码，你可以在【本文首发于唐霜的博客】github本文作者：唐霜，转载请注明出处。上view到。本文版权归作者所有，未经授权不得转载。
著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】/** * omd 让你写的javascript代码兼容所有的运行环境，符合amd, cmd, commonjs规范，在原生环境中也能运行
* 例如，你写了一堆代码，在没有模块化加载的时候可以使用，在模块化框架下也可以使用
*/
!function(spacename,dependencies,window,factory){
// 当define被定义的情况下
if(typeof define == 'function' && (define.amd != undefined || define.cmd != undefined)) {
define(dependencies,function() {
return factory(window);
});
}
// 当define没有被定义的情况下
else {
var ex = factory(window);
// CommonJS NodeJS
if(typeof module !== 'undefined' && typeof exports === 'object') {
// 由于exports被定义，函数中的exports已经是全局变量，因此，这里就不进行任何操作
module.exports = ex;
}
// 原生Javascript，接口将被作为一个window的子对象
else {
window[spacename] = ex;
}
}
}('spaceName',['jquery'],window,function(window){
var $ = (window.$ != undefined ? window.$ : null);
// var $ = require('jquery');
/**
* 如何上手呢？
* 1. 修改上面的'spaceName'为当前文件的名称（不要后缀）【在非模块化环境中使用其接口会加载到window中，例如你可以使用类似window.spaceName.function()来调用某个接口函数】
* 2. 修改上面['jquery']的内容为依赖包列表【在模块化环境中可能使用】
* 3. window就是window，有你需要的window属性
* 4. 加载$，如果你的项目中依赖了jQuery或Zepto，则选择上面注释中的一种，使$可用
* 5. 接口，通过return返回接口
*/
});
OMD原理详解原创内容，盗版必究。
本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。在《【关注微信公众号：wwwtangshuangnet】javascript立即执行某个函数：插【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】件中function(){}()再思考》一文中，我详细阐述了【作者：唐霜】!function(fun){}(function($){});，因此这里就不详细阐述了。【原创内容，转载请注明出处】
兼容amd和cmd【原创不易，请尊重版权】
【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】未经授权，禁止复制转载。if(typeof define == 'function' && (define.amd != undefined || define.cmd != undefined) {
define(function() {
return fun($);
});
}
上面这段代码，仅在amd或cmd规范下使【未经授权禁止转载】【原创不易，请尊重版权】用时才执行define。我们这里把范围缩本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。小到require.js和sea.js。【作者：唐霜】【本文受版权保护】对于require.js而言，defin著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。e和define.amd是可见的，因此执本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】行define(function(){}转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。);，同样的道理，sea.js也会执行。本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。但是作为两种不同的规范，为何可以以相同的【原创内容，转载请注明出处】【作者：唐霜】代码返回呢？
本文作者：唐霜，转载请注明出处。【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】在require.js中，一个模块如此去【关注微信公众号：wwwtangshuangnet】【本文受版权保护】定义：
【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】define({});
define(factory);
define(id,dependencies,factor);
define(dependencies,factor)
在sea.js中也差不多，但是也有不同之未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net处：
未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.netdefine({});
define(factory);
define(id,dependencies,factory);
define(id,factory);
前面三种都是一样的，但是细节上也有所不同【原创内容，转载请注明出处】【版权所有】唐霜 www.tangshuang.net，第一种以对象的方式定义并不能解决我们插【作者：唐霜】未经授权，禁止复制转载。件中接口传递的目的，因此不考虑。剩下的就本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】只有两种相同的形式，但是就像前文说到的一【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】样，OMD是为了实现兼容，也就是说它必须【作者：唐霜】【转载请注明来源】作为框架被应用，框架的基础代码具有稳定性转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】，不能让用户改来改去，否则也就失去了规范【版权所有】唐霜 www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】的意义。而在剩下的两种中，define(id,dependencies,factory)的前两个变量，都需要自己去定义，因此，也转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】被排除。最终也就只有define(factory)这种形式被我们采用。本文版权归作者所有，未经授权不得转载。
define(function(require,exports,module){
var a = require('a');
});
这种代码形式在require.js和se【转载请注明来源】【原创不易，请尊重版权】a.js中都可以使用，可是在sea.js【本文首发于唐霜的博客】未经授权，禁止复制转载。中，可以使用exports.xxx = function(){}来提供接口，可是在require.js中原创内容，盗版必究。本文版权归作者所有，未经授权不得转载。，不得不采用return的形式，幸好，在本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。sea.js中，return也是有效的。【作者：唐霜】【未经授权禁止转载】所以，最终，我们选择了return的形式本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】向外提供接口：
define(function(){
return {
fun1 : function(a,b) {},
fun2 : function(c,d) {}
}; // return的结果为一个对象
});
在sea.js或require.js中：
转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。【转载请注明来源】define(function(){
var $omd = require('omd');
var fun1 = $omd.fun1(12,34);
});
这样，在omd.js中写的插件所提供的模【原创不易，请尊重版权】未经授权，禁止复制转载。块接口，就可以被使用了。
【版权所有】唐霜 www.tangshuang.net【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。兼容comomjs转载请注明出处：www.tangshuang.net
转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】未经授权，禁止复制转载。【未经授权禁止转载】当define没有被定义的时候，说明跟s本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。ea.js和require.js没有任何著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。关系了，这个时候，我们要检查是否支持no【版权所有，侵权必究】【本文受版权保护】de.js。
未经授权，禁止复制转载。【转载请注明来源】【版权所有】唐霜 www.tangshuang.net如果是在node.js环境下运行，那么m本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。odule和exports是一个由核心库未经授权，禁止复制转载。原创内容，盗版必究。提供的全局变量。因此，只需要将插件提供的未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】接口赋值给module.exports，【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。就完成了当前文件（模块）所提供的接口了。
转载请注明出处：www.tangshuang.net【作者：唐霜】原创内容，盗版必究。兼容原生的javascript【转载请注明来源】
【关注微信公众号：wwwtangshuangnet】转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】【本文受版权保护】当以上情况都不满足的情况下，实际上，你所【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】提供的接口，就是一个函数。你提供了一个f【版权所有】唐霜 www.tangshuang.net【本文受版权保护】un1的接口，你就可以在其他javasc【关注微信公众号：wwwtangshuangnet】【访问 www.tangshuang.net 获取更多精彩内容】ript代码中执行fun1()函数。
【未经授权禁止转载】本文作者：唐霜，转载请注明出处。原创内容，盗版必究。【本文受版权保护】【关注微信公众号：wwwtangshuangnet】全局变量$和局部变量$转载请注明出处：www.tangshuang.net
【作者：唐霜】【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】【本文首发于唐霜的博客】【本文首发于唐霜的博客】把$作为变量名，最大的好处是兼容jque【版权所有】唐霜 www.tangshuang.net【作者：唐霜】ry和zepto。在第一个functio本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。n(fun){}中，我两次使用到了fun未经授权，禁止复制转载。【本文首发于唐霜的博客】($)，在这里，$没有被事先声明过，因此【本文首发于唐霜的博客】【关注微信公众号：wwwtangshuangnet】用了一个if(typeof $ === 【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net‘undefinedR【本文首发于唐霜的博客】本文版权归作者所有，未经授权不得转载。17;)做判断。但是如果当前环境下已经加转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】载了jquery或zepto，$就是一个转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。全局变量，实际上它是window.$。因【作者：唐霜】转载请注明出处：www.tangshuang.net此，在执行fun($)时，实际上是把$作转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.net为参数传递给了fun()。
【关注微信公众号：wwwtangshuangnet】【作者：唐霜】原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】【转载请注明来源】而在前面那篇关于立即执行函数的文章中我已【未经授权禁止转载】【原创不易，请尊重版权】经讲过了，在这里的fun()实际上就是第著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】二个我们要真正用来写插件代码的function($){}，要理解这一点，你必须读懂上面那篇文章。
在fun($)中，$如果代表jquery【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。或zepto，那么它实际上是一个全局变量【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】。而到了function($)，$实际上【本文受版权保护】未经授权，禁止复制转载。成为函数的参数，成为一个局部变量。在fu【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。nction($){}中，虽然你可以使用转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。$(‘#div1’【访问 www.tangshuang.net 获取更多精彩内容】【本文受版权保护】;)进行选择，但你要知道，这里的$并非全著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】局变量window.$，而是传递而来的。原创内容，盗版必究。【未经授权禁止转载】下文还会提到，要使用 var jQuery = $; 这样诡异的代码来处理某些情况。【转载请注明来源】
fun($)返回值问题未经授权，禁止复制转载。
著作权归作者所有，禁止商业用途转载。【本文受版权保护】本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。在第一次使用fun($)时，return转载请注明出处：www.tangshuang.net本文版权归作者所有，未经授权不得转载。 fun($)。第二次时，ex = fu【本文受版权保护】【原创内容，转载请注明出处】n($)。从值的返回角度讲，fun($)【本文受版权保护】【本文首发于唐霜的博客】必然存在一个return。具体是什么意义【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net呢？
著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net原创内容，盗版必究。fun($)的返回值，其实就是插件提供的【访问 www.tangshuang.net 获取更多精彩内容】原创内容，盗版必究。对外接口，而实际上，就是一个对象Obje著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】ct。我们可以在第一次return fu【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。n($);的时候，也先执行一次赋值操作：
著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】【未经授权禁止转载】未经授权，禁止复制转载。define(function(){
var ex = fun($);
return ex;
});
前面已经讲过了，amd和cmd在defi【作者：唐霜】著作权归作者所有，禁止商业用途转载。ne的function中return，实转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】际上是模块对外提供接口的一种方式，而这种【版权所有，侵权必究】未经授权，禁止复制转载。方式，必须保证以对象的形式返回。因此，在本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】插件代码中，你可以看到，我首先定义的是一【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。个ex = {}，然后执行return ex;从而对外提转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。供了接口。
而在node.js环境下，只需要将这个e【转载请注明来源】著作权归作者所有，禁止商业用途转载。x返回值赋予exports即可完成该模块转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。的接口。在原生的JavaScript环境【作者：唐霜】著作权归作者所有，禁止商业用途转载。下，没有接口这种概念，对外提供的，则是函未经授权，禁止复制转载。【原创内容，转载请注明出处】数或对象属性，将它赋予window对象，【未经授权禁止转载】转载请注明出处：www.tangshuang.net就相当于提供了一个全局函数或全局变量。
未经授权，禁止复制转载。【版权所有】唐霜 www.tangshuang.net【本文首发于唐霜的博客】OMD开发规则本文作者：唐霜，转载请注明出处。
【版权所有，侵权必究】【原创内容，转载请注明出处】【转载请注明来源】【版权所有】唐霜 www.tangshuang.net利用omd开发兼容各个规范的插件（模块）【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。时，只需要在// 真正的插件代码都在这里 这句注释后面撰写插件代码即可，无需像其原创内容，盗版必究。转载请注明出处：www.tangshuang.net他教程所示一样，写一个(function【本文首发于唐霜的博客】【访问 www.tangshuang.net 获取更多精彩内容】($){}(jQuery))，直接写插件原创内容，盗版必究。转载请注明出处：www.tangshuang.net内容即可。如果无需对外提供接口，则写完插【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】件代码就可以完成开发。
关于var jQuery = $本文版权归作者所有，未经授权不得转载。
著作权归作者所有，禁止商业用途转载。【作者：唐霜】【本文首发于唐霜的博客】著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。在插件代码中，一些插件并没有使用$，而是【未经授权禁止转载】本文作者：唐霜，转载请注明出处。使用jQuery。但是前文已经提到了，在【本文受版权保护】原创内容，盗版必究。这个函数内部，jQuery是未定义的，$【转载请注明来源】原创内容，盗版必究。是传递过来的变量，因此，将$赋值给jQu【作者：唐霜】原创内容，盗版必究。ery，则让jQuery重新有效。
【原创内容，转载请注明出处】本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。如果需要对外提供接口，则在【本文受版权保护】// 接口开始后面使用对象属性的方式，将接口赋值给ex【本文首发于唐霜的博客】【版权所有，侵权必究】。注意一点，ex返回后，你不可以通过接口本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】改变插件内部的变量，这个接口是对外接口。
利用OMD开发的步骤【关注微信公众号：wwwtangshuangnet】
【本文受版权保护】本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net【转载请注明来源】1.在开始撰写你的任何javascrip【本文首发于唐霜的博客】未经授权，禁止复制转载。t代码文件之前，将omd.js的代码框架【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。拷贝到该文件中；
转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。2.在注释中对应的位置开始撰写你的脚步代【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net码
【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。3.在注释中指出接口输出的位置处，通过【本文受版权保护】ex.fun = function(){}的方式返回接口转载请注明出处：www.tangshuang.net
4.完成代码写作之后，利用JavaScr本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.netipt压缩工具，净化和压缩你的Javas【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。cript代码
本文作者：唐霜，转载请注明出处。【转载请注明来源】【本文受版权保护】著作权归作者所有，禁止商业用途转载。OMD使用要点【作者：唐霜】
【本文首发于唐霜的博客】【版权所有，侵权必究】原创内容，盗版必究。原创内容，盗版必究。和sea.js不同，require.js转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。的所有模块都是异步加载，这意味着你不能按本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】照以往的方式，通过先加载哪个模块，然后加【作者：唐霜】【原创内容，转载请注明出处】载另外一个模块来确定它们的依赖关系。不幸未经授权，禁止复制转载。【原创不易，请尊重版权】的是，所有的jquery插件都要依赖jq【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.netuery库。因此，在require中需要著作权归作者所有，禁止商业用途转载。【本文受版权保护】解决好这个依赖问题。依赖的用法只有在de【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。fine的参数中，前面已经提到了defi【原创不易，请尊重版权】【版权所有】唐霜 www.tangshuang.netne的几种用法，我们来看下具体的实现方法本文作者：唐霜，转载请注明出处。【转载请注明来源】：
【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。define(['jquery'],function($){
require(['plugin.omd.js'],function($plugin){
$('#test').plugin();
$plugin.p('#test');
});
});
上面的代码中，define([̵转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】6;jquery’])首先确【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】定了这个模块依赖于jquery，并将其返未经授权，禁止复制转载。原创内容，盗版必究。回接口以$作为变量。在这个基础上，再去r【转载请注明来源】未经授权，禁止复制转载。equire(omd.js)，则可以让o原创内容，盗版必究。【未经授权禁止转载】md.js中的对jQuery的依赖可以实本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。现，omd.js中才可以正常使用jque【作者：唐霜】【版权所有】唐霜 www.tangshuang.netry。
本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】【未经授权禁止转载】不过，从require.js的设计上，模【本文受版权保护】【本文首发于唐霜的博客】块之间都是异步加载的，如果按照上述方法解【作者：唐霜】【原创内容，转载请注明出处】决依赖问题，性能上比sea.js要差很多著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。。
本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。下面是老版本的代码，可供参考：【作者：唐霜】
【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net;(function(){
function _init() {
console.log('init');
// ……插件功能部分代码……，很多国外插件都加入了amd的兼容，因此，要注意一下
(function($) {
// jQuery代码部分，如果是原生的JS，则不需要这个闭包来进行jquery处理，但是如果用jquery的话，就这样
$.fn.fillText = function(text) {
console.log('jquery plugin');
this.each(function(){
console.log('jquery plugin one element');
$(this).text(text);
});
}
})(jQuery);
}
function _export1(param1,param2) {
console.log('export1');
}
function _export2(param1,param2) {
console.log('export2:' + param1);
}
// CommonJS
if (typeof module !== 'undefined' && typeof exports === 'object') {
_init();
exports.export1 = _export1;
exports.export2 = _export2;
}
// amd & cmd
else if (typeof define === 'function' && (define.amd || define.cmd)) {
define(function() {
_init();
var exports = {};
exports.export1 = _export1;
exports.export2 = _export2;
return exports;
});
}
// javascript
else {
_init();
this.export1 = _export1;
this.export2 = _export2;
}
}).call(function() {
return this || (typeof window !== 'undefined' ? window : global);
});
其中_init()函数会在每一个接口的地【作者：唐霜】【本文首发于唐霜的博客】方去执行一次，当然，你可以根据你自己的一【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net些情况，增加更多的函数。
【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】【访问 www.tangshuang.net 获取更多精彩内容】而exports是返回的接口，可以当做对【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。象方法来用。
【本文受版权保护】【版权所有，侵权必究】【未经授权禁止转载】我已经将这个代码放到【作者：唐霜】github原创内容，盗版必究。上，里面有demo，你可以看下plugi本文作者：唐霜，转载请注明出处。【本文受版权保护】n.js和main.js，来看看具体的用【版权所有，侵权必究】【作者：唐霜】法。
【版权所有】唐霜 www.tangshuang.net原创内容，盗版必究。【关注微信公众号：wwwtangshuangnet】【未经授权禁止转载】【版权所有】唐霜 www.tangshuang.net2016-01-20 6450
