号外:kitjs官方讨论QQ群建立了,QQ群号88093625,欢迎大家加入,讨论前端相关话题
kit内置支持requireJs托管,可以使用requireJs加载和管理KitJs框架内的所有组件和类库
最近园子里有很多讨论requireJs(http://requirejs.org/)的兄弟,requireJs托管js代码的好处有
1.通过闭包提供了一个安全沙箱,保证js代码不会互相污染
2.基于AMD规范,支持了js的依赖关系,实现了依赖载入
3.对于大量跨域,或者大量重复的依赖,提供一个基于程序的打包合并压缩的工具
kitjs整合了requireJs的好处是,可以让显式申明在网页的js加载更少,同事也让kitjs可以完全模拟jQuery的代码写法
demo地址:http://xueduany.github.com/KitJs/KitJs/demo/Requirejs/t1.html
查看源代码,我们可以看到,整个页面,我们只需要引用require.js一个js,其他文件都是通过同域,异步加载过来的
require(['kit'], function(dependency) {
define('', ['suger', 'widget/Mask/mask', 'widget/Dialog/dialog'], function($) {
var d = new $kit.ui.Dialog();
d.init();
d.center();
});
});
先通过require方法载入kit.js的core,然后通过define加载suger.js,在suger.js内部有这样的实现
在suger.js代码内部申明了suger.js模块的依赖关系,同时定义了suger.js模块返回对象为$kit.$方法,把这个方法传给后面的匿名方法的第一个参数$,这样就可以用 $符号使用$kit.$方法了,这样写出来的js代码就和jQuery代码完全一样。^^
需要注意的是,requireJs的define方法加载的模块,只有在代码内部定义了返回值时,才有返回对象,如果没有定义则和普通的异步加载js并执行无异,只是多了一个js依赖关系
有了这个依赖关系,我们确实可以省去显式申请很多的js代码的依赖了,是不?同学,赶紧试一试吧
jsdoc地址:http://xueduany.github.com/jsdoc/out/global.html#define