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 相关文章推荐
js判断当前页面用什么浏览器打开的方法
Jan 06 Javascript
BootStrap入门教程(二)之固定的内置样式
Sep 19 Javascript
Javascript面试经典套路reduce函数查重
Mar 23 Javascript
bootstrap弹出层的多种触发方式
May 10 Javascript
详解React-Native解决键盘遮挡问题(Keyboard遮挡问题)
Jul 13 Javascript
JS实现合并json对象的方法
Oct 10 Javascript
js数组方法reduce经典用法代码分享
Jan 07 Javascript
webpack4.0打包优化策略整理小结
Mar 30 Javascript
JS实现获取word文档内容并输出显示到html页面示例
Jun 23 Javascript
Vue源码之关于vm.$delete()/Vue.use()内部原理详解
May 01 Javascript
VUE实现自身整体组件销毁的示例代码
Jan 13 Javascript
vue打包静态资源后显示空白及static文件路径报错的解决
Sep 02 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实现变色验证码实例
2014/01/06 PHP
PHP 实现页面静态化的几种方法
2017/07/23 PHP
Laravel5.5 手动分页和自定义分页样式的简单实现
2019/10/15 PHP
jQuery 获取对象 根据属性、内容匹配, 还有表单元素匹配
2010/05/31 Javascript
基于jquery的下拉框改变动态添加和删除表格实现代码
2020/09/12 Javascript
JS验证身份证有效性示例
2013/10/11 Javascript
JS中的form.submit()不能提交表单的错误原因
2014/10/08 Javascript
上传文件返回的json数据会被提示下载问题解决方案
2014/12/03 Javascript
CSS+JS实现点击文字弹出定时自动关闭DIV层菜单的方法
2015/05/12 Javascript
基于jQuery+JSON的省市二三级联动效果
2015/06/05 Javascript
Jquery幻灯片特效代码分享--鼠标点击按钮时切换(1)
2015/08/15 Javascript
JS实现微信弹出搜索框 多条件查询功能
2016/12/13 Javascript
Bootstrap table 定制提示语的加载过程
2017/02/20 Javascript
Vue.js如何优雅的进行form validation
2017/04/07 Javascript
微信小程序页面开发注意事项整理
2017/05/18 Javascript
详解在vue-cli项目中安装node-sass
2017/06/21 Javascript
浅谈react-native热更新react-native-pushy集成遇到的问题
2017/09/30 Javascript
基于vue cli重构多页面脚手架过程详解
2018/01/23 Javascript
JS表单传值和URL编码转换
2018/03/03 Javascript
JavaScript实现JSON合并操作示例【递归深度合并】
2018/09/07 Javascript
angular使用md5,CryptoJS des加密的方法
2019/06/03 Javascript
bootstrap table插件动态加载表头
2019/07/19 Javascript
vue中beforeRouteLeave实现页面回退不刷新的示例代码
2019/11/01 Javascript
Python 3.6 中使用pdfminer解析pdf文件的实现
2019/09/25 Python
python实现将json多行数据传入到mysql中使用
2019/12/31 Python
python super函数使用方法详解
2020/02/14 Python
使用python实现多维数据降维操作
2020/02/24 Python
详解python百行有效代码实现汉诺塔小游戏(简约版)
2020/10/30 Python
canvas实现漂亮的下雨效果的示例
2018/04/18 HTML / CSS
HTML5中的websocket实现直播功能
2018/05/21 HTML / CSS
Bluebella美国官网:英国性感内衣品牌
2018/10/04 全球购物
英国领先的在线鱼贩:The Fish Society
2020/08/12 全球购物
Unix控制后台进程都有哪些进程
2016/09/22 面试题
实习单位接收函
2014/01/11 职场文书
银行服务理念口号
2015/12/25 职场文书
Python3中PyQt5简单实现文件打开及保存
2021/06/10 Python