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 相关文章推荐
iis6+javascript Add an Extension File
Jun 13 Javascript
JS获取月的最后一天与JS得到一个月份最大天数的实例代码
Dec 16 Javascript
JavaScript中判断页面关闭、页面刷新的实现代码
Aug 27 Javascript
jQuery动态星级评分效果实现方法
Aug 06 Javascript
内容滑动切换效果jquery.hwSlide.js插件封装
Jul 07 Javascript
基于jQuery ligerUI实现分页样式
Sep 18 Javascript
微信小程序template模板实例详解
Oct 27 Javascript
Vue.js实现分页查询功能
Nov 15 Javascript
JavaScript时间日期操作实例小结【5个示例】
Dec 22 Javascript
JavaScript命名空间模式实例详解
Jun 20 Javascript
微信小程序分包加载代码实现方法详解
Sep 23 Javascript
JavaScript原型继承和原型链原理详解
Feb 04 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写的小东西
2006/12/06 PHP
JSON用法之将PHP数组转JS数组,JS如何接收PHP数组
2015/10/08 PHP
JQuery Study Notes 学习笔记(一)
2010/08/04 Javascript
jQuery.extend 函数的详细用法
2012/06/27 Javascript
防止浏览器记住用户名及密码的简单实用方法
2013/04/22 Javascript
关于jquery.validate1.9.0前台验证的使用介绍
2013/04/26 Javascript
jquery禁用右键示例
2014/04/28 Javascript
JavaScript 性能优化小结
2015/10/12 Javascript
javascript实现uploadify上传格式以及个数限制
2015/11/23 Javascript
JS区分浏览器页面是刷新还是关闭
2016/04/17 Javascript
jQuery表单对象属性过滤选择器实例详解
2016/09/13 Javascript
微信开发 使用picker封装省市区三级联动模板
2016/10/28 Javascript
jQuery实现立体式数字滚动条增加效果
2016/12/21 Javascript
详解浏览器渲染页面过程
2017/02/09 Javascript
ES6新特性之函数的扩展实例详解
2017/04/01 Javascript
深入理解Commonjs规范及Node模块实现
2017/05/17 Javascript
细说webpack源码之compile流程-入口函数run
2017/12/26 Javascript
解决Jstree 选中父节点时被禁用的子节点也会选中的问题
2017/12/27 Javascript
解决Linux无法正常安装与卸载Node.js的方法
2018/01/19 Javascript
详解开发react应用最好用的脚手架 create-react-app
2018/04/24 Javascript
浅谈微信小程序之官方UI框架we-ui使用教程
2018/08/20 Javascript
详解关闭令人抓狂的ESlint 语法检测配置方法
2019/10/28 Javascript
Python中使用第三方库xlrd来写入Excel文件示例
2015/04/05 Python
Python中index()和seek()的用法(详解)
2017/04/27 Python
使用python将图片格式转换为ico格式的示例
2018/10/22 Python
selenium+python自动化测试之页面元素定位
2019/01/23 Python
利用css3实现的简单的鼠标悬停按钮
2014/11/04 HTML / CSS
浅析图片上传及canvas压缩的流程
2020/06/10 HTML / CSS
英国领先的新鲜松露和最好的松露产品供应商:TruffleHunter
2019/08/26 全球购物
都柏林通行卡/城市通票:The Dublin Pass
2020/02/16 全球购物
先进德育工作者事迹材料
2014/01/24 职场文书
三年级语文教学反思
2014/02/01 职场文书
创业者是否需要商业计划书?
2014/02/07 职场文书
本科生就业推荐信
2014/05/19 职场文书
班级元旦晚会开幕词
2015/01/29 职场文书
Redis 限流器
2022/05/15 Redis