问题
随着AJAX的流行,JS在web应用中的比重越来越大。随之而来,对JS代码的维护和重用就需要有一套机制来管理。
Java中除了对象、类这些概念外,还有一个灵活的包机制。众所周知,JS本身并没有内建这样的机制,所以像一些JS框架,如DOJO,就自己实现了一套。
在我们当前的项目里,评估了几个JS框架,然后决定了采用Mootools,主要是因为它更加OO,更有利于重用。遗憾的是Mootools并有包机制这些概念。那我们可否自己实现一套简单的包机制呢?
分析
Java的包机制需要JVM的一些支持,而JS的情况更加接近于cpp。cpp中是使用include不同的头文件来使用不同的模块,使用namespace来避免模块命名上的冲突。也就是说我们要在js上实现namespace和include的机制。
实现
声明名字空间
$ns(namespace);
namespace 命名空间名称,例如:"owl.ui"
var $ns= function(namespace) {
var namePiece = namespace.split(".");
var curName = namePiece[0];
eval('if (typeof ' + curName + ' == "undefined"){' + curName + ' = {};} var curSpace = ' + curName + ';');
for(var nameIdx = 1; nameIdx < namePiece.length; ++nameIdx) {
curSpace[namePiece[nameIdx]] = curSpace[namePiece[nameIdx]] || {};
curSpace = curSpace[namePiece[nameIdx]];
}
return curSpace;
};
$ns('owl.ui');
owl.ui.CheckBox = function() {
alert("Called checkbox!");
}
owl.ui.CheckBox();
导入JS文件
$inc(path, version);
path js文件的路径及名称,如: owl/Test
version js文件的版本,如:1.0
var $inc = function(path, version) {
if (typeof JS_ROOT == 'undefined') {
JS_ROOT = '/js/'
}
var jsFile = JS_ROOT + path + '-' + version + '.js';
document.writeln("<scri"+"pt src='" + jsFile + "' type='text/javascript'></sc"+"ript>");
}
$inc('test', '1.0');
更加完善的$inc
var JSLoader = new Class({
Implements: [Options],
options: {
loadedJS : {},
jsRoot : "js/"
},
initialize: function(options){
this.setOptions(options);
$(document).getElements('script[src]').each(function(script) {
var jsFile = $(script).get('src');
var jsPath = jsFile.substring(0, jsFile.lastIndexOf('-'));
if (!$chk(this.options.loadedJS[jsPath])) {
this.options.loadedJS[jsPath] = true;
}
}, this);
},
load: function(path, version) {
if ($chk(this.options.loadedJS[path])) {
return;
}
var jsFile = this._make_js_file_name(path, version);
document.writeln("<scri"+"pt src='" + jsFile + "' type='text/javascript'></sc"+"ript>");
},
_make_js_file_name: function(path, version) {
var fileName = this.options.jsRoot + path;
if ($chk(version)) {
fileName += '-' + version;
}
fileName += '.js';
return fileName;
}
});
var $inc = function() {
var jsLoader = new JSLoader();
return function(path, version) {
jsLoader.load(path, version);
};
}();
其实Mootools的Assert插件可以载入JS,CSS,Image这些资源文件。
总结
任何项目的代码都是累积起来的,都是要维护的,其实管理JS代码的意识才是关键。这里简单实现的$ns, $inc原语只是为大家提供了一种方式。不知道大家是怎么管理js代码的,可以共同探讨一下。
分享到:
- 2009-03-01 21:55
- 浏览 1190
- 评论(1)
- 论坛回复 / 浏览 (1 / 2406)
- 查看更多
相关推荐
一文带你了解JavaScript垃圾回收机制 目录 1. 概述 2. 内存管理 3. 垃圾回收 4. GC算法介绍 5. 引用计数算法 1. 引用计数优缺点 6. 标记清除算法 1. 标记清除算法优缺点 7. 标记整理算法 8. 执行时机 9. V8引擎 1...
2.4.4使用模块与包管理源代码 第3章页面布局设计 3.1使用布局小部件设计页面框架 3.1.1小部件与布局小部件简介 3.1.2使用面板组织页面元素 3.1.3使用容器小部件设计页面布局 3.2可移动的小部件微架构 3.2.1自定义小...
javascript从定义到执行,JS引擎在实现层做了很多初始化工作,因此在学习JS引擎工作机制之前,我们需要引入几个相关的概念:执行环境栈、全局对象、执行环境、变量对象、活动对象、作用域和作用域链等,这些概念正是...
Node.js的实现机制、Node.js的原生扩展与应用;Node.js的编码习惯;Node.js操作MySQL和MongoDB;基于Node.js的Myweb框架的基本设计架构及实现;利用Myweb框架实现一个简单的Web聊天室;在线聊天室案例和在线中国象棋...
系统地讲解了如何构建一个日常生产环境实用的基于Spring Boot并且集成springmvc + shiro + mybatis-plus + beetl的后台管理系统,可管理代码生成模版,管理连接生成代码的数据库. Guns框架自带的功能:1.用户管理 2....
示例描述:介绍JavaScript管理cookie和userData。 11.1.html JavaScript写数据到cookie。 11.2.html JavaScript获取cookie信息。 11.3.html JavaScript修改cookie的保存有效期。 11.4.html 保存数据...
动软.Net代码生成器Codematic是一款为C#数据库程序员设计的自动代码生成器,Codematic生成的...•支持扩展插件机制的代码生成和插件的自定制开发。 •免费提供数据访问类库组件,页面数据校验等等通用函数类库源码。
如果我们想要优化性能,首先我们必须得了解JavaScript中的垃圾回收机制,...在JavaScript中,具有自动垃圾回收机制,也就是说执行环境会自动负责管理代码执行过程中的内存使用情况,会自动清除一些没有用的变量,以此
JavaScript万年历 显示出当前时间及年份,还可以选择年份及月份和日期 Java编写的HTML浏览器 一个目标文件 摘要:Java源码,网络相关,浏览器 Java编写的HTML浏览器源代码,一个很简单甚至不算是浏览器的HTML浏览器...
DbToCode 是一款为 C# 数据库程序员设计的自动代码生成器,DbToCode 生成的代码基于基于面向对象的思想和三层架构设计,结合了Petshop中经典的思想和设计模式,融入了工厂模式,反射机制等等一些思想。采用 Model +...
基于Spring Boot开发的JS个人云盘管理系统设计与实现资源介绍 在数字化时代的浪潮下,个人云盘管理系统成为了人们日常生活中不可或缺的一部分。本次毕业设计旨在通过Spring Boot框架,结合前端技术,开发一款功能...
Javascript具有自动垃圾回收机制(GC:Garbage Collecation),也就是说,执行环境会负责管理代码执行过程中使用的内存。 原理:垃圾收集器会定期(周期性)找出那些不在继续使用的变量,然后释放其内存。 JavaScript...
引入全局事件及跨页面事件管理机制,让跨页面间的模块调用变得简单。 引入第三方Teambition的then.js库作为promise处理替代,提高同、异步操作效率。 快速入门 安装 你可以通过GitHub直接下载Zip包进行解压。 项目...
” 我们希望以安全的方式执行不受信任的第三方JavaScript代码,并通过命令行界面(CLI)管理执行。 我们使用Docker作为我们的沙盒技术(运行不受信任的代码的机制)。 代码将在隔离的容器进程中运行,我们将通过...
和C#、Java一样JavaScript有自动垃圾回收机制,也就是说执行环境会负责管理代码执行过程中使用的内存,在开发过程中就无需考虑内存分配及无用内存的回收问题了。JavaScript垃圾回收的机制很简单:找出不再使用的变量...
JavaScript 具有自动垃圾收集机制,也就是说,执行环境会负责管理代码执行过程中使用的内存。 在编写 JavaScript 程序时,开发人员不用再关心内存使用问题,所需内存的分配以及无用内存的回收完全实现了自动管理。...
3.3.4 Node.js包管理器 41 3.4 调试 45 3.4.1 命令行调试 45 3.4.2 远程调试 47 3.4.3 使用Eclipse调试Node.js 48 3.4.4 使用node-inspector调试Node.js 54 3.5 参考资料 55 第4章 Node.js核心模块...
在技术实现上,JSP教师档案管理系统利用JSP与Servlet相结合的方式,前端页面使用HTML、CSS和JavaScript构建,后端则由Java Beans处理数据逻辑。数据库方面,系统可能采用了MySQL或其他关系型数据库来存储和管理数据...
类似SQLServer2000的管理界面,方便平常在代码编辑的时候想查看数据库的信息,并且可以很直观的查看字段类型,长度,主键,默认值等详细信息,省去了在代码和数据库管理器之间的来回切换,方便快捷。 (1)...