A JavaScript Fancier

伟大的javascript技术研究中...

  IT博客 :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理 ::
  304 随笔 :: 0 文章 :: 479 评论 :: 0 Trackbacks

(1)根据传入的参数类型不同做不同处理:
例如:
当我们要获取一个html元素对象时,要判断传入的是一个id还是一个元素对象,其次要判断该元素是否存在

 1   <script language="JavaScript" type="text/javascript">
 2   <!--
 3  function test(elm){ //elm为传入的一个html元素对象或id
 4   //判断传入的时元素id还是对象
 5   var obj=typeof(elm)=="string"?document.getElementById(elm):elm;
 6   //判断元素是否存在
 7   if(!obj){
 8    alert('传入的对象不存在!请检查!');
 9    return;
10   }
11  }
12   //-->
13   </script>

 

(2)为参数设定默认值。
例如:

 1   <script language="JavaScript" type="text/javascript">
 2   <!--
 3  function defaultArg(arg1,arg2){ //假设参数只可能是字符串的情况
 4   var arg1=arg1||"default arg1";
 5   var arg2=arg2||"default arg2";
 6   alert(arg1+","+arg2);
 7  }
 8  defaultArg(); //弹出内容为:"default arg1,default arg2"
 9  defaultArg("my arg1"); //弹出内容为:"my arg1,default arg2"
10  defaultArg("my arg1","my arg2");//弹出内容为:"my arg1,my arg2"
11   //-->
12   </script>


(3)检查传入的参数类型。
例如:
我们要求传入的某个参数必须为数字。

 1  <script language="JavaScript" type="text/javascript">
 2   <!--
 3  function checkArg(arg1,arg2){
 4   if(arg1==undefined){alert('arg1必须初始化!');return}
 5   if(typeof(arg1)!="number"){alert('arg1必须是数字!');return}
 6   alert('参数合法');
 7  }
 8  checkArg(); //弹出内容为:"arg1必须初始化!"
 9  checkArg("sss");//弹出内容为:"arg1必须是数字!"
10  checkArg(5); //弹出内容为:"参数合法"
11   //-->
12   </script>
13 

再比如可能我们需要通过参数设定一个宽度或高度值:

 1 <script language="JavaScript" type="text/javascript">
 2   <!--
 3  //在html页面中,一般我们设定的宽度值用小于1000(1-3位数字)的数字或者用百分比表示
 4  function setWidth(w){
 5   var width="300px";
 6   //允许1-3位数字和百分比
 7   if(/^\d{1,3}$/.test(w)){
 8    width=w+"px";
 9   }else if(/^(\d{1,2}%)|100%$/.test(w)){
10    width=w;
11   }else{
12    alert("设置的宽度值不合法!将使用默认设置");
13   }
14   alert("你输入的宽度值为:"+width);
15  }
16  setWidth(100); //合法值
17  setWidth(2500); //超过1000,不合法
18  setWidth("ddd"); //字符串,不合法
19  setWidth();   //未传入
20  setWidth("80%"); //百分比,合法值
21  setWidth("1000%"); //大于100%,不合法
22   //-->
23   </script>
24 


(4)在JS的oo编程中,如果程序要获取当前实例名,则必须对传入实例名做判断。
例如:

 1 <script language="JavaScript" type="text/javascript">
 2   <!--
 3  var insCounter=0//标识不同的实例
 4  function GetInsName(insName){
 5   this.__id__="sign-"+insCounter++//当前实例标识
 6   this.__insName__=insName;
 7   this.__initalize__=0//是否做过参数检验
 8  }
 9  //参数检验
10  GetInsName.prototype.__init__=function(){
11   if(!this.__insName__){alert('提示:初始化失败!请传入实例名称');return}
12   try{
13    //传入的实例名非本对象的实例,或者为两个实例设定了相同的实例名,返回错误信息
14    if(!eval(this.__insName__+" instanceof GetInsName")||eval(this.__insName__+".__id__")!=this.__id__){
15     //不正确的实例名称
16     alert("提示:初始化失败!请设定正确的实例名称");
17     return;
18    }
19   }catch(e){ //如果传入的实例名称不存在,则上面的eval(this._insName)会出现找不到对象的错误
20    //不存在的实例名称
21    alert("提示:初始化失败!您设定的实例名称不存在,请重新设定");
22    return;
23   }
24   this.__initalize__=1;
25   return true;
26  }
27  GetInsName.prototype.someMethod=function(){
28   if(!this.__initalize__&&!this.__init__()){return//返回false则不执行该函数
29   alert("传入的实例名称正确!");
30  }
31 
32  var tempVar="test"//一个临时变量
33  var ins1=new GetInsName();
34  var ins2=new GetInsName("ttt"); //不存在的实例名
35  var ins3=new GetInsName("ins2"); //非本实例的实例名
36  var ins4=new GetInsName("tempVar"//非本对象的实例名
37  var ins5=new GetInsName("ins5");
38 
39  ins1.someMethod();
40  ins2.someMethod();
41  ins3.someMethod();
42  ins4.someMethod();
43  ins5.someMethod();
44   //-->
45   </script>


(5)在解析xml数据之前首先要检查传入xml数据类型(Dom?xml字符串?文件名)及其结构的合法性。
例如:

 1   <script language="JavaScript" type="text/javascript">
 2   <!--
 3  function loadXML(xml){
 4   if (window.ActiveXObject){
 5    var xmlDom=new ActiveXObject("Microsoft.XMLDOM");
 6   }else{
 7    if (document.implementation&&document.implementation.createDocument){
 8     var xmlDom=document.implementation.createDocument("","doc",null); 
 9    } 
10   }           
11   xmlDom.async = false;
12   xmlDom.preserveWhiteSpace=true;
13   
14   //先作为xml文件加载,再作为xml字串加载
15   if(!xmlDom.load(xml)){
16    try{
17     xmlDom.loadXML(xml);
18    }catch(e){ //非IE浏览器
19     var oParser=new DOMParser();
20     xmlDom=oParser.parseFromString(xml,"text/xml");
21    }
22   }
23   return xmlDom;
24  }
25 
26  function parseXML(xml){
27   if(!xml){alert('请设定xml数据');return}
28   var xmlDom=typeof(xml)=="object"?xml:loadXML(xml); //判断是对象还是字符串(字符串包括xml数据串或文件名)
29   if(!xmlDom.documentElement){
30    alert("提示:非法的xml数据!");
31    return;
32   }
33   alert("合法的xml数据!");
34  }
35 
36  var xmlDom=loadXML("<t><c>dom</c></t>");
37  parseXML();
38  parseXML("<d><t>test</t></d>"); //传入合法的xml数据
39  parseXML("<d><t></d>"); //传入非法的xml数据
40  parseXML(xmlDom); //传入Dom类型数据
41  //parseXML("data.xml") //传入xml文件
42   //-->
43   </script>

 

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

 1   <script language="JavaScript" type="text/javascript">
 2   <!--
 3  //在html页面中,一般我们设定的宽度值用小于1000(1-3位数字)的数字或者用百分比表示
 4  try{
 5   //userData操作对象
 6   dataContainer=document.documentElement;
 7   dataContainer.addBehavior("#default#userdata"); 
 8   //操作userData数据
 9   
10  }catch(e){
11    //执行其他操作
12  } 
13   //-->
14   </script> 
posted on 2007-05-07 19:02 Yemoo'S JS Blog 阅读(843) 评论(1)  编辑 收藏 引用 所属分类: javascript技巧总结

评论

# re: 增强js程序代码的健壮性 2007-07-19 22:52 l
写的真好啊,都是博主的经验之谈。  回复  更多评论
  

只有注册用户登录后才能发表评论。