“增强js程序代码的健壮性”之我见大量示例代码_javascript技巧

在书写和使用js程序的过程中，我们经常会遇到各种各样的错误，对于一个依赖于浏览器的语言，我们很难完全去控制其在任何时刻都正确无误的运行。但是我们仍需做出自己努力取增强我们书写的js程序代码的健壮性和安全性，尽可能减少错误的出现概率。
以下为本人在学习js过程总结的几点关于增强js程序的健壮性的心得，如果您觉得对你有一点的价值，那我就达到自己的目的了，如果你觉得没有什么意义，请您也不必扔砖头，谢谢。
(1)对于必要的参数要判断是否被正确的传入。
代码示例：

<script language="JavaScript" type="text/javascript"> <!-- function getArg(arg){ //判断元素是否存在 if(arg==undefined){ alert('提示：必须传入一个参数！'); return ; } alert('参数为：'+arg); } getArg("abcde") getArg(); //--> </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(2)根据传入的参数类型不同做不同处理：
例如当我们要获取一个html元素对象时，要判断传入的是一个id还是一个元素对象。
代码示例：

<title> new document </title> <meta name="generator" content="editplus"> <meta name="author" content=""> <meta name="keywords" content=""> <meta name="description" content=""> <div id="a">area a</div> <div id="b">area b</div> <script language="JavaScript" type="text/javascript"> <!-- function getInnerHTML(elm){ //elm为传入的一个html元素对象或id //判断传入的时元素id还是对象 var obj=typeof(elm)=="string"?document.getElementById(elm):elm; //判断元素是否存在 if(!obj){ alert('传入的对象不存在！请检查！'); return ""; } return obj.innerHTML; } alert(getInnerHTML("a")); alert(getInnerHTML(document.getElementById("b"))); alert(getInnerHTML("c")); //--> </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(3)为参数设定默认值。

<script language="JavaScript" type="text/javascript"> <!-- function defaultArg(arg1,arg2){ //假设参数只可能是字符串的情况 var arg1=arg1||"default arg1"; var arg2=arg2||"default arg2"; alert(arg1+","+arg2); } defaultArg(); //弹出内容为："default arg1,default arg2" defaultArg("my arg1"); //弹出内容为："my arg1,default arg2" defaultArg("my arg1","my arg2"); //弹出内容为："my arg1,my arg2" //--> </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(4)检查传入的参数类型。
例如：
我们要求传入的某个参数必须为数字。
示例代码：

<script language="JavaScript" type="text/javascript"> <!-- function checkArg(arg1,arg2){ if(arg1==undefined){ alert('arg1必须初始化!'); return; } if(typeof (arg1)!="number"){ alert('arg1必须是数字!'); return; } alert('参数合法'); } checkArg(); //弹出内容为："arg1必须初始化!" checkArg("sss"); //弹出内容为："arg1必须是数字!" checkArg(5); //弹出内容为："参数合法" //--> </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

再比如可能我们需要通过参数设定一个宽度或高度值：
示例代码：

<script language="JavaScript" type="text/javascript"> <!-- //在html页面中，一般我们设定的宽度值用小于1000（1-3位数字）的数字或者用百分比表示 function setWidth(w){ var width="300px"; //允许1-3位数字和百分比 if(/^\d{1,3}$/.test(w)){ width=w+"px"; }else if(/^(\d{1,2}%)|100%$/.test(w)){ width=w; }else { alert("设置的宽度值不合法！将使用默认设置"); } alert("你输入的宽度值为："+width); } setWidth(100); //合法值 setWidth(2500); //超过1000，不合法 setWidth("ddd"); //字符串，不合法 setWidth(); //未传入 setWidth("80%"); //百分比，合法值 setWidth("1000%"); //大于100%，不合法 //--> </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(5)在JS的oo编程中，如果程序要获取当前实例名，则必须对传入实例名做判断。
示例代码：

<script language="JavaScript" type="text/javascript"> <!-- var insCounter=0; //标识不同的实例 function GetInsName(insName){ this.__id__="sign-"+insCounter++; //当前实例标识 this.__insName__=insName; this.__initalize__=0; //是否做过参数检验 } //参数检验 GetInsName.prototype.__init__=function (){ if(!this.__insName__){ alert('提示：初始化失败！请传入实例名称'); return ; } try{ //传入的实例名非本对象的实例，或者为两个实例设定了相同的实例名，返回错误信息 if(!eval(this.__insName__+" instanceof GetInsName")||eval(this.__insName__+".__id__")!=this.__id__){ //不正确的实例名称 alert("提示：初始化失败！请设定正确的实例名称"); return ; } }catch(e){ //如果传入的实例名称不存在，则上面的eval(this._insName)会出现找不到对象的错误 //不存在的实例名称 alert("提示：初始化失败！您设定的实例名称不存在，请重新设定"); return ; } this.__initalize__=1; return true; } GetInsName.prototype.someMethod=function (){ if(!this.__initalize__&&!this.__init__()){return;} alert("传入的实例名称正确！"); } var tempVar="test"; //一个临时变量 var ins1=new GetInsName(); var ins2=new GetInsName("ttt"); //不存在的实例名 var ins3=new GetInsName("ins2"); //非本实例的实例名 var ins4=new GetInsName("tempVar") //非本对象的实例名 var ins5=new GetInsName("ins5"); ins1.someMethod(); ins2.someMethod(); ins3.someMethod(); ins4.someMethod(); ins5.someMethod(); //--> </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(6)在解析xml数据之前首先要检查传入xml数据类型（Dom？xml字符串？文件名）及其结构的合法性。
示例代码：

<script language="JavaScript" type="text/javascript"> <!-- function loadXML(xml){ if(window.ActiveXObject){ var xmlDom=new ActiveXObject("Microsoft.XMLDOM"); }else{ if(document.implementation&&document.implementation.createDocument){ var xmlDom=document.implementation.createDocument("","doc",null); } } xmlDom.async=false; xmlDom.preserveWhiteSpace=true; //先作为xml文件加载，再作为xml字串加载 if(!xmlDom.load(xml)){ try{ xmlDom.loadXML(xml); }catch(e){ //非IE浏览器 var oParser=new DOMParser(); xmlDom=oParser.parseFromString(xml,"text/xml"); } } return xmlDom; } function parseXML(xml){ if(!xml){ alert('请设定xml数据'); return ; } var xmlDom=typeof (xml)=="object"?xml:loadXML(xml); //判断是对象还是字符串（字符串包括xml数据串或文件名） if(!xmlDom.documentElement){ alert("提示：非法的xml数据！"); return ; } alert("合法的xml数据！"); } var xmlDom=loadXML("<t><c>dom"); parseXML(); //未设定数据 parseXML("<d><t>test"); //传入合法的xml数据 parseXML("<d><t>"); //传入非法的xml数据 parseXML(xmlDom); //传入Dom类型数据 //parseXML("data.xml") //传入xml文件 //--> </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(7)善用try...catch语句，很多时候的错误我们无法屏蔽，使用try...catch可以很容易的将这些错误过滤掉。
比如当我们在使用userData时，很多浏览器不支持，使用try...catch可以简化我们的处理。

<script language="JavaScript" type="text/javascript"> <!-- try{ //userData操作对象 dataContainer=document.documentElement; dataContainer.addBehavior("#default#userdata"); alert('可以操作userData数据'); }catch(e){ alert('不支持userData,请执行其他操作'); } //--> </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

欢迎大家多评论，提出更好更多的建议。
arg==undefined 改成 arg === undefined 可能会好些
var arg1=arg1||"default arg1";
这样写略有点问题
arg1是null 0 "" false都不行

<script language="JavaScript" type="text/javascript"> <!-- alert(null==undefined); alert(null===undefined); //--> </script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

三个等号表示类型也相等。JS在比较时不会自动转换类型。