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 相关文章推荐
Mootools 1.2教程(21)——类(二)
Sep 15 Javascript
浏览器脚本兼容 文本框中,回车键触发事件的兼容
Jun 21 Javascript
JavaScript OOP面向对象介绍
Dec 02 Javascript
浅谈Javascript 执行顺序
Dec 18 Javascript
node.js中的path.sep方法使用说明
Dec 08 Javascript
JavaScript控制table某列不显示的方法
Mar 16 Javascript
JavaScript获取指定元素位置的方法
Apr 08 Javascript
js实现动态创建的元素绑定事件
Jul 19 Javascript
JavaScript实现解析INI文件内容的方法
Nov 17 Javascript
JavaScript刷新页面的几种方法总结
Mar 28 Javascript
angular组件间传值测试的方法详解
May 07 Javascript
JS如何操作DOM基于表格动态展示数据
Oct 15 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
PHP strtok()函数的优点分析
2010/03/02 PHP
PHP中获取变量的变量名的一段代码的bug分析
2011/07/07 PHP
PHP strip_tags()去除HTML、XML以及PHP的标签介绍
2014/02/18 PHP
简单概括PHP的字符串中单引号与双引号的区别
2016/05/07 PHP
PHP网站常见安全漏洞,及相应防范措施总结
2021/03/01 PHP
JavaScript窗口功能指南之在窗口中书写内容
2006/07/21 Javascript
myFocus slide3D v1.1.0 使用方法与下载
2011/01/12 Javascript
基于jquery的滚动条滚动固定div(附演示下载)
2012/10/29 Javascript
javascript与jquery中跳出循环的区别总结
2013/11/04 Javascript
javascript自定义startWith()和endWith()的两种方法
2013/11/11 Javascript
js生成的验证码的实现与技术分析
2014/09/17 Javascript
JS实现的自定义右键菜单实例二则
2015/09/01 Javascript
JQuery实现Ajax加载图片的方法
2015/12/24 Javascript
jQuery Easyui学习教程之实现datagrid在没有数据时显示相关提示内容
2016/07/09 Javascript
Listloading.js移动端上拉下拉刷新组件
2016/08/04 Javascript
JS数组操作中的经典算法实例讲解
2017/07/26 Javascript
angular4 如何在全局设置路由跳转动画的方法
2017/08/30 Javascript
JavaScript 跨域之POST实现方法
2018/05/07 Javascript
基于element-ui组件手动实现单选和上传功能
2018/12/06 Javascript
jsonp实现百度下拉框功能的方法分析
2019/05/10 Javascript
JS实现横向轮播图(中级版)
2020/01/18 Javascript
python实现发送和获取手机短信验证码
2016/01/15 Python
python使用mysql的两种使用方式
2018/03/07 Python
selenium+python实现自动化登录的方法
2018/09/04 Python
在Python文件中指定Python解释器的方法
2019/02/18 Python
python交易记录整合交易类详解
2019/07/03 Python
Python log模块logging记录打印用法解析
2020/01/20 Python
Django调用百度AI接口实现人脸注册登录代码实例
2020/04/23 Python
基于Python和C++实现删除链表的节点
2020/07/06 Python
Python的logging模块基本用法
2020/12/24 Python
css3动画事件—webkitAnimationEnd与计时器time事件
2013/01/31 HTML / CSS
实习生自荐信范文
2013/11/13 职场文书
投标承诺书范本
2014/03/27 职场文书
宣传标语大全
2014/07/01 职场文书
2015年班组工作总结
2015/04/20 职场文书
javascript进阶篇深拷贝实现的四种方式
2022/07/07 Javascript