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

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

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

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

new document

area a

area b

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

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

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

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

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

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

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

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

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

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

dom");
parseXML(); //未设定数据
parseXML("test"); //传入合法的xml数据
parseXML(""); //传入非法的xml数据
parseXML(xmlDom); //传入Dom类型数据
//parseXML("data.xml") //传入xml文件
//-->

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

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

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

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

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

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

赞 (0)

相关推荐

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

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

  • 微信小程序实现列表滚动头部吸顶的示例代码

    本文介绍了小程序头部吸顶的实现代码示例,分享给大家,也给自己留个笔记 demo 地址: https://github.com/iotjin/Jh_weapp 效果图: 吸顶主要是 position: sticky; .header { background: rgb(230, 230, 230); height: 25px; line-height: 25px; padding-left: 30rpx; font-size: 13px; align-items: center; position

  • 利用js实现Ajax并发请求限制请求数量的示例代码

    出现问题描述:当不确定异步请求个数时,为防止当一瞬间发生上百个http请求时,导致堆积了无数调用栈进而导致内存溢出问题. 要求:将同一时刻并发请求数量控制在3个以内,同时还要尽可能快速的拿到响应的结果. 同面试问题: 实现一个批量请求函数 multiRequest(urls, maxNum),要求如下: 要求最大并发数 maxNum 每当有一个请求返回,就留下一个空位,可以增加新的请求 所有请求完成后,结果按照 urls 里面的顺序依次打出 1.基于Promise.all实现Ajax的串行和并行

  • 30行代码实现React双向绑定hook的示例代码

    目录 使用Proxy代理数据 使用useRef创建同一份数据引用 添加更新handler 去除多次Proxy 添加缓存完善代码 总结 Sandbox 示例 Vue和MobX中的数据可响应给我们留下了深刻的印象,在React函数组件中我们也可以依赖hooks来实现一个简易好用的useReactive. 看一下我们的目标 const CountDemo = () => { const reactive = useReactive({ count: 0, }); return ( <div onCl

  • js带按钮的提示框可供选择示例代码

    今天在项目当中遇到一个问题(本人前台功底不深,高手勿喷): 可以供选择的弹出框: 利用jQuery没有想到好的提示效果. 参看js的API文档实现如下===confirm: 复制代码 代码如下: var r=confirm("该订单号已经存在,请重新输入或查询已存在订单详情!") if (di != null&& (r==true)) { userNameCnl.focus();//定位 userNameCnl.value = "";//清空数据 }

  • js 判断文件类型并控制表单提交示例代码

    下面的代码 实现的控制表单提交 复制代码 代码如下: function shangchuan(){ var filepath = document.getElementById("file").value; alert(filepath); if(filepath==""){ alert("请选择上传的文件!"); document.getElementById("file").disabled=true; } var ext

  • 快速实现JS图片懒加载(可视区域加载)示例代码

    快速实现JS图片懒加载(可视区域加载)示例代码

    js懒加载图片 如何提高网页加载速度?在网页中有许多img标签,这些标签就是图片,其属性src则是指向服务器地址,当浏览器从上往下读取到src标签中的地址时,浏览器就会开启线程,加载这张图片.而并不是等到整张页面都解析完成才加载图片.我们要做的就是加载用户可视范围内的图片. js懒加载图片的目的 1.网页优化,提高网页加载速度 2.页面优化友好,提高SEO收录与排名 3.提高用户体验,减少服务器压力 实例代码如下: <!DOCTYPE html> <html lang="en&

  • js实现局部页面打印预览原理及示例代码

    最近有朋友问js 如何打印预览,今天就来讲解一下,首先了解一下打印原理,其实局部打印页面很简单.就是把你需要打印的部分做一个起始标记,至于标记如何写,随便你写什么.我这里就写 <!--startprint--> 需要打印的内容 <!--endprint-->. 因为标记是不需要让用户看见的所以加了注释!具体实现代码如下: <!DOCTYPE html> <html> <head> <title>打印预览简单实现</title&g

  • Js日期选择器并自动加入到输入框中示例代码

    复制代码 代码如下: <html> <head> <title>Js日期选择器并自动加入到输入框中</title> <meta http-equiv="content-Type" content="text/html;charset=gb2312"> <script type="text/javascript"> var gMonths=new Array("一月&

  • js获取判断上传文件后缀名的示例代码

    复制代码 代码如下: function lastname(){ //获取欲上传的文件路径var filepath = document.getElementById("file1").value; //为了避免转义反斜杠出问题,这里将对其进行转换var re = /(\\+)/g; var filename=filepath.replace(re,"#");//对路径字符串进行剪切截取var one=filename.split("#");//获

随机推荐