JavaScript“尽快失败”的原则实例详解


Posted in Javascript onOctober 08, 2016

我第一次听说编码原则中有“尽快失败”这一条时,觉得很奇怪,为什么代码要失败?应该成功才对呀。但事实上,当代码在遇到错误的时候应该尽快的终止。为了检测各种状态,我们需要频繁的创建if语句与条件分支,而这些条件检测的结果不是成功就是失败(true&&false)。之所以会有这么多的条件检测语句,是因为如果不在构建过程中植入这些监测点(checkpoint),那么浏览器内核会执行很多无用的代码,并占用许多宝贵的CPU性能和处理时间,拖慢网站加载速度。

根据那些判断结果为false的检测语句块放置位置的不同,有些情况下,一旦发生错误就迅速中止,而另外一些情况下则会在执行了很长一段时间的无用代码后才终止。如果我们在遍历数组之前先检测其长度,或是在处理DOM时先看看有没有我们需要的class属性,那么就可以在不满足条件时立刻中止代码的执行。因为遍历数组信息与解析DOM都是相当耗时的工作,所以最好是在执行这些任务之前先检测一下,在满足于执行条件时及早终止。正是基于上述原因,所以我才要提倡那种“尽快失败”的代码。

这是我的示例代码:

//创建在遇到错误时尽快终止的代码
(function Salad(totalSlices,peopleCount){ //我要创建一个沙拉函数,用来返回派对需要的总沙拉数量
"use strict";
var fairness = totalSlices * peopleCount;
return fairness;
})();
(function () {
"use strict";
var body = document.getElementsByTagName("body")[0],
//我在此闭包函数中建立了一些变量,并将其传入salad函数以供计算
partyStarter = "starlen",
peopleCount = 18,
Salad = 6,
sliceCount = Salad * 3;
if(peopleCount > 0 && Salad >0){
//先检测一下我们的派对有没有人或沙拉,避免js消耗不必要的计算性能
body.innerHTML += " '<p>'"+ partyStarter +","+ Salad(peopleCount,Salad) +" '</p>' "
} else {
body.innerHTML += "<p>参加聚会的人数或沙拉果盘不足!</p>"
}
})();

在输出某些变量信息之前,我们首先检查确保这些变量信息是否保存于内存之中或者某些数组内的变量是否大于0,从而回避那些不需要执行那些计算代码了。这是在日常的开发工作中基础且重要的易引发性能的问题,所以要重视。

以上所述是小编给大家介绍的JavaScript“尽快失败”的原则实例详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jQuery 三击事件实现代码
Sep 11 Javascript
javacript使用break内层跳出外层循环分析
Jan 12 Javascript
jQuery提示插件alertify使用指南
Apr 21 Javascript
纯js实现无限空间大小的本地存储
Jun 18 Javascript
jQuery实现图片与文字描述左右滑动自动切换的方法
Jul 27 Javascript
jquery 实现输入邮箱时自动补全下拉提示功能
Oct 04 Javascript
如何利用JS通过身份证号获取当事人的生日、年龄、性别
Jan 22 Javascript
浅谈JavaScript 中有关时间对象的方法
Aug 15 Javascript
JS实现侧边栏鼠标经过弹出框+缓冲效果
Mar 29 Javascript
Angular.JS中select下拉框设置value的方法
Jun 20 Javascript
详解在React.js中使用PureComponent的重要性和使用方式
Jul 10 Javascript
Node.js fs模块原理及常见用途
Oct 22 Javascript
jQuery如何解决IE输入框不能输入的问题
Oct 08 #Javascript
微信小程序 canvas API详解及实例代码
Oct 08 #Javascript
微信小程序 animation API详解及实例代码
Oct 08 #Javascript
AngularJS实践之使用NgModelController进行数据绑定
Oct 08 #Javascript
Bootstrap Navbar Component实现响应式导航
Oct 08 #Javascript
微信小程序 WXML、WXSS 和JS介绍及详解
Oct 08 #Javascript
JS中使用mailto实现将用户在网页中输入的内容传递到本地邮件客户端
Oct 08 #Javascript
You might like
学习php设计模式 php实现门面模式(Facade)
2015/12/07 PHP
php.ini中date.timezone设置详解
2016/11/20 PHP
thinkphp3.2实现在线留言提交验证码功能
2017/07/19 PHP
PHP中OpenSSL加密问题整理
2017/12/14 PHP
js计算精度问题小结
2013/04/22 Javascript
js复制到剪切板的实例方法
2013/06/28 Javascript
js使用数组判断提交数据是否存在相同数据
2013/11/27 Javascript
可插入图片的TEXT文本框
2013/12/27 Javascript
nodejs获取本机内网和外网ip地址的实现代码
2014/06/01 NodeJs
js的延迟执行问题分析
2014/06/23 Javascript
js的toUpperCase方法用法实例
2015/01/27 Javascript
JS实现三个层重叠点击互相切换的方法
2015/10/06 Javascript
JavaScript SweetAlert插件实现超酷消息警告框
2016/01/28 Javascript
基于JS实现回到页面顶部的五种写法(从实现到增强)
2016/09/03 Javascript
js实现目录链接,内容跟着目录滚动显示的简单实例
2016/10/15 Javascript
详解Node 定时器
2018/02/26 Javascript
bootstrap模态框弹出和隐藏,动态改变中间内容的实例
2018/08/10 Javascript
Vue插件从封装到发布的完整步骤记录
2019/02/28 Javascript
JavaScript实现汉字转换为拼音及缩写的方法示例
2019/03/28 Javascript
webpack结合express实现自动刷新的方法
2019/05/07 Javascript
vue项目中常见问题及解决方案(推荐)
2019/10/21 Javascript
JavaScript多种图形实现代码实例
2020/06/28 Javascript
在Vue 中获取下拉框的文本及选项值操作
2020/08/13 Javascript
[49:12]完美世界DOTA2联赛PWL S2 Magma vs GXR 第二场 11.29
2020/12/02 DOTA
Ubuntu下安装PyV8
2016/03/13 Python
Python3 适合初学者学习的银行账户登录系统实例
2017/08/08 Python
Django后端接收嵌套Json数据及解析详解
2019/07/17 Python
详解如何在css3打包后自动追加前缀插件:autoprefixer
2018/12/18 HTML / CSS
Rockport乐步美国官网:风靡美国的白宫鞋
2016/11/24 全球购物
英国办公用品商店:Office Outlet
2018/04/04 全球购物
Nasty Gal英国:美国女性服饰销售网站
2021/03/02 全球购物
String s = new String(“xyz”);创建了几个String Object?
2015/08/05 面试题
关于圣诞节的广播稿
2014/01/26 职场文书
教师群众路线剖析材料
2014/09/29 职场文书
2014年初级职称工作总结
2014/12/08 职场文书
详解MySQL中timestamp和datetime时区问题导致做DTS遇到的坑
2021/12/06 MySQL