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 相关文章推荐
静态的动态续篇之来点XML
Dec 23 Javascript
DOMAssitant最新版 DOMAssistant 2.5发布
Dec 25 Javascript
妙用Jquery的val()方法
Jun 27 Javascript
JavaScript获取数组最小值和最大值的方法
Jun 09 Javascript
javascript精确统计网站访问量实例代码
Dec 19 Javascript
jQuery实现div横向拖拽排序的简单实例
Jul 13 Javascript
AngularJS Ajax详解及示例代码
Aug 17 Javascript
jquery根据一个值来选中select下的option实例代码
Aug 29 Javascript
jQuery中 bind的用法简单介绍
Feb 13 Javascript
Vue实现动态响应数据变化
Apr 28 Javascript
微信小程序如何实现精确的日期时间选择器
Jan 21 Javascript
Chrome插件开发系列一:弹窗终结者开发实战
Oct 02 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
英雄试炼之肉山谷—引领RPG新潮流
2020/04/20 DOTA
destoon调用自定义模板及样式的公告栏
2014/06/21 PHP
PHP的PDO连接讲解
2019/01/24 PHP
原型方法的不同写法居然会影响调试的解决方法
2007/03/08 Javascript
javascript 操作Word和Excel的实现代码
2009/10/26 Javascript
js计算精度问题小结
2013/04/22 Javascript
Javascript事件实例详解
2013/11/06 Javascript
JavaScript中的console.assert()函数介绍
2014/12/29 Javascript
JS获取iframe中marginHeight和marginWidth属性的方法
2015/04/01 Javascript
jQuery实现控制文字内容溢出用省略号(…)表示的方法
2016/02/26 Javascript
javascript获取wx.config内部字段解决微信分享
2016/03/09 Javascript
JavaScript易错知识点整理
2016/12/05 Javascript
jQuery插件FusionCharts实现的2D饼状图效果【附demo源码下载】
2017/03/03 Javascript
纯js实现图片匀速淡入淡出效果
2017/08/22 Javascript
JS禁止浏览器右键查看元素或按F12审查元素自动关闭页面示例代码
2017/09/07 Javascript
VUE中的无限循环代码解析
2017/09/22 Javascript
import与export在node.js中的使用详解
2017/09/28 Javascript
Angular2.0/4.0 使用Echarts图表的示例代码
2017/12/07 Javascript
JavaScript时间戳与时间日期间相互转换
2017/12/11 Javascript
vuejs项目打包之后的首屏加载优化及打包之后出现的问题
2018/04/01 Javascript
javascript将非数值转换为数值
2018/09/13 Javascript
vue debug 二种方法
2018/09/16 Javascript
angular2 NgModel模块的具体使用方法
2019/04/10 Javascript
Node.js API详解之 timer模块用法实例分析
2020/05/07 Javascript
原生JavaScript创建不可变对象的方法简单示例
2020/05/07 Javascript
最小二乘法及其python实现详解
2020/02/24 Python
python单元测试框架pytest的使用示例
2020/10/07 Python
CSS3中currentColor关键字的妙用
2016/02/27 HTML / CSS
公司营业员的工作总结自我评价
2013/10/05 职场文书
小车司机岗位职责
2013/11/25 职场文书
欢迎领导标语
2014/06/27 职场文书
婚礼新人答谢词
2015/01/04 职场文书
土木工程毕业答辩开场白
2015/05/29 职场文书
2015年国庆晚会主持词
2015/07/01 职场文书
2015年学校远程教育工作总结
2015/07/20 职场文书
Python 全局空间和局部空间
2022/04/06 Python