JavaScript 开发中规范性的一点感想


Posted in Javascript onJune 23, 2009

可谓一劳永逸,不要重复造轮子:)
1.常用的方法统一放置
例如:在用户注册时,时常需要判断文本框中字符是否是汉字、英文、数字或邮箱地址等等。何不把这些方法统一放在一个脚本中,取名叫做utility.js呢?

//待需要时另存为一个js function isNull(obj) 
{ 
if (!obj || obj.length==0 || obj=="") 
{ 
parent.MyAlert("标注名不能为空!",alertImg); 
return false; 
} 
else 
{ 
return true; 
} 
} 
// 验证是否为整数 
function isNumber(oNum) 
{ 
if(!oNum) return false; 
try{ 
if(parseInt(oNum)!=oNum) { 
parent.MyAlert("查询距离请填写正整数!",alertImg); 
return false; 
} 
} 
catch(ex) 
{ 
parent.MyAlert("查询距离请填写正整数!",alertImg); 
return false; 
} 
return true; 
} 
// 验证是否为中文 
function isChinese(oCn) 
{ 
if (!oCn || oCn.length==0) return false; 
try{ 
var reg = /^[\u4e00-\u9fa5]+$/i; //含中文 
if ( reg.test(oCn) ) 
{ 
return true; 
} 
else{ 
parent.MyAlert("关键字请填写中文!",alertImg); 
return false; 
} 
} 
catch(ex) 
{ 
parent.MyAlert("关键字请填写中文!",alertImg); 
return false; 
} 
} 
// 验证是否为中文或字母 
function isEnCh(oStr) 
{ 
if (!oStr || oStr.length==0) return false; 
try{ 
var reg = /^[a-zA-Z\u4E00-\u9FA5]/g; //含中文或拼音 
if ( reg.test(oStr) ) 
{ 
return true; 
} 
else{ 
parent.MyAlert("地名请填写中文或拼音!",alertImg); 
return false; 
} 
} 
catch(ex) 
{ 
parent.MyAlert("地名请填写中文或拼音!",alertImg); 
return false; 
} 
} 
// 结果保留2位小数 
function roundAmount(n){ 
var s = "" + Math.round(n * 100) / 100; 
var i = s.indexOf('.') 
if (i < 0) return s + ".00"; 
var t = s.substring(0, i + 1) + s.substring(i + 1, i + 3); 
if (i + 2 == s.length) t += "0"; 
return t; 
}

2.提示、报错信息统一放置

看了上面的代码,您是否也发现一个问题:下一个项目中如果提示、报错信息不一样,还需要重新改动上述代码。何不把提示信息统一放在一个脚本中,取名叫做resource_zh.js呢?

在多语言版本的软件中,也有用类似的招数达到切换界面语言,有发现?呵呵。

var page_res = { 
    "meter": "米", 
    "kilometer": "千米(公里)", 
    "mile": "英里", 
    "yard": "码", 
    "degree": "度", 
    "millimeter": "毫米", 
    "saveMap": "保存地图", 
    "printMap": "打印地图", 
    "queryResult": "查询结果", 
    "queryResultNull": "查询结果为空", 
    "experssionCanNotNull": "查询表达式不能为空", 
    "networkInfo": "路径信息", 
    "arcInfo": "弧段信息", 
    "addEntitySuccess": "添加地物成功! ", 
    "addEntityFail": "添加地物失败!", 
    "updateEntitySuccess": "更新地物成功!", 
    "updateEntityFail": "更新地物失败!", 
    "updatePropertySuccess": "更新属性成功!", 
    "updatePropertyFail": "更新属性失败!", 
    "deleteEntitySuccess": "删除地物成功!", 
    "deleteEntityFail": "删除地物失败!", 
    "closestFacilityFail": "最近设施分析失败,请重新选择", 
    "fieldCanNotNull": "字段数不能为空", 
    "fieldMustInteger": "字段数必须为整数", 
    "fieldMustMoreThanZero": "字段数必须大于0", 
    "numberCanNotNull": "数值不能为空" 
}

我们可以把常用的单位、按钮文本、提示信息都放在这里。然后最先加载该脚本,通过eval实例化出一个对象。通过类似res.networkInfo便可获得对应的内容。

3.AjaxRequest请求封装

跟第一点意义是一致的,在现在开发中频繁使用Ajax,如果您没用jQuery等脚本库的话,可能是自己写每次请求和回调的函数。何不把这些方法都放在一个ajax.js中呢?

var xmlhttpObj=false; 
function XHR(CallBack) 
{ 
this.callback=CallBack; 
} 
XHR.createXMLHttp = function () 
{ 
if(window.ActiveXObject) //IE浏览器 
{ 
try 
{ 
xmlhttpObj = new ActiveXObject("Microsoft.XMLHTTP");//IE4.0 
} 
catch (e) 
{ 
try 
{ 
xmlhttpObj = new ActiveXObject("Msxml2.XMLHTTP");//IE5.0以上 
} 
catch (e2) 
{ 
xmlhttpObj=false; 
} 
} 
} 
else if(window.XMLHttpRequest&&!xmlhttpObj) //开放浏览器 
{ 
xmlhttpObj = new XMLHttpRequest(); 
} 
} 
XHR.prototype.Onstar = function (method,Url,bFlag,param) 
{ 
if(this.callback!=null) 
{ 
XHR.createXMLHttp(); 
xmlhttpObj.onreadystatechange=this.callback; 
xmlhttpObj.open(method,Url,bFlag); 
xmlhttpObj.setRequestHeader("Content-Type","application/x-www-form-urlencoded;"); 
xmlhttpObj.send(param); 
} 
else 
{ 
alert("没有客户端处理函数!") 
} 
}

在使用时实例化一个XHR对象出来,例如:var legendObj=new XHR(function (){...}); 然后用legendObj.Onstar("POST","Handlers/legendHandler.ashx",false,"mapName=" + mapName);提交请求即可。
Javascript 相关文章推荐
捕获关闭窗口的脚本
Jan 10 Javascript
javascript qq右下角滑出窗口 sheyMsg
Mar 21 Javascript
javascript单例模式的简单实现方法
Jul 25 Javascript
jQuery右侧选项卡焦点图片轮播特效代码分享
Sep 05 Javascript
深入剖析JavaScript中的函数currying柯里化
Apr 29 Javascript
jQuery Ztree行政地区树状展示(点击加载)
Nov 09 Javascript
Bootstrap select实现下拉框多选效果
Dec 23 Javascript
node+vue实现用户注册和头像上传的实例代码
Jul 20 Javascript
利用JS如何计算字符串所占字节数示例代码
Sep 13 Javascript
JavaScript插入排序算法原理与实现方法示例
Aug 06 Javascript
详解vue项目中调用百度地图API使用方法
Apr 25 Javascript
JavaScript的function函数详细介绍
Nov 20 Javascript
jQuery 表单验证插件formValidation实现个性化错误提示
Jun 23 #Javascript
一个很酷的拖动层的js类,兼容IE及Firefox
Jun 23 #Javascript
一些常用的JS功能函数代码
Jun 23 #Javascript
JQuery 无废话系列教程(二) jquery实战篇上
Jun 23 #Javascript
JQuery 无废话系列教程(一) jquery入门 [推荐]
Jun 23 #Javascript
IE JS编程需注意的内存释放问题
Jun 23 #Javascript
js form 验证函数 当前比较流行的错误提示
Jun 23 #Javascript
You might like
Codeigniter实现发送带附件的邮件
2015/03/19 PHP
WordPress中制作导航菜单的PHP核心方法讲解
2015/12/11 PHP
Docker 如何布置PHP开发环境
2016/06/21 PHP
WebGame《逆转裁判》完整版 代码下载(1月24日更新)
2007/01/29 Javascript
网上应用的一个不错common.js脚本
2007/08/08 Javascript
用正则表达式 动态创建/增加css style script 兼容IE firefox
2009/03/10 Javascript
jquery实现树形二级菜单实例代码
2013/11/20 Javascript
给事件响应函数传参数的四种方式小结
2013/12/05 Javascript
在JS中解析HTML字符串示例代码
2014/04/16 Javascript
jquery通过select列表选择框对表格数据进行过滤示例
2014/05/07 Javascript
Jquery给基本控件的取值、赋值示例
2014/05/23 Javascript
javascript判断css3动画结束 css3动画结束的回调函数
2015/03/10 Javascript
JQuery工具函数汇总
2015/06/15 Javascript
JavaScript中用于生成随机数的Math.random()方法
2015/06/15 Javascript
javascript自定义滚动条实现代码
2020/04/20 Javascript
AngularJS 霸道的过滤器小结
2017/04/26 Javascript
详解Element 指令clickoutside源码分析
2019/02/15 Javascript
JS自定义对象创建与简单使用方法示例
2020/01/15 Javascript
JavaScript实现打砖块游戏
2020/02/25 Javascript
Python 命令行非阻塞输入的小例子
2013/09/27 Python
PyQt5主窗口动态加载Widget实例代码
2018/02/07 Python
基于DataFrame改变列类型的方法
2018/07/25 Python
Python使用爬虫抓取美女图片并保存到本地的方法【测试可用】
2018/08/30 Python
Python监听剪切板实现方法代码实例
2020/11/11 Python
马来西亚网上购物:Youbeli
2018/03/30 全球购物
会计实习生自我鉴定
2013/12/12 职场文书
面试后的英文感谢信
2014/02/01 职场文书
中国好声音华少广告词
2014/03/17 职场文书
社区党建工作方案
2014/06/10 职场文书
2014最新房贷收入证明范本
2014/09/12 职场文书
解除劳动关系协议书2篇
2014/11/28 职场文书
2014年电话客服工作总结
2014/12/09 职场文书
八年级上册语文教学计划
2015/01/22 职场文书
小学语文教师研修日志
2015/11/13 职场文书
大学班长竞选稿
2015/11/20 职场文书
幼儿园教师辞职信
2019/06/21 职场文书