javascript代码重构需要考虑的问题(一)
1.将数组的长度进行存储,循环时就不用每次去读取一次数组长度,从而提升性能
例如:
for (var i = 0, len = arr.length; i < len; i++) {
//do something...
}
2.js中所有 非空字符 ,非零,作布尔运算时,都会返回 true,反之返回 false。 (空格 属于非空字符)
例如:
if (value) {
//do something...
}
3.多层条件嵌套,进行 转换 或 拆分 //bad
if (user.id === 10) {
if (user.name !== "") {
if (user.email === "email") {
//do something...
}
}
} //good
if(user.id === 10 && user.name !=="" && user.email === "email") {
//do something...
} //good
if (user.id !== 10) return;
if (user.name === "") return;
if (user.email !== "email") return;
//do something...
4. 尽可能的减少DOM操作,将DOM操作放在循环体之外,数据处理好后,只执行一次DOM操作即可。
5.避免使用 连等号 声明赋值变量。js基础好点的同学都知道,这里存在着一个坑: b 会被声明为全局变量,意思就是在 test() 方法之外b也是可以被访问到的。 全局变量是不推荐使用的,容易污染环境。
6.
//bad
if (age > 20) {
console.log("年龄大于20");
}
//good
(age > 20) && console.log("年龄大于20");
这里的bad并不是说第一种写法不好,其实就可读性来说,第一种比第二种更好。 只是第二种写法更加优雅一点(个人觉得)。 这个句法可能有些同学用的比较少,解释一下:
如果第一个条件为 true ,那么就执行后面的语句,第一个条件为false, 后面的语句便不会执行。后面的语句可以是表达式,方法,或变量,常量都可以。 比如 (age > 20) && test()。
https://www.cnblogs.com/similar/p/5016424.html
javascript代码重构需要考虑的问题(一)的更多相关文章
- js基石之---易读、易复用、易重构的 JavaScript 代码规范
易读.易复用.易重构的 JavaScript 代码规范 1.变量命名规范有意义 Bad: const yyyymmdstr = moment().format("YYYY/MM/DD&quo ...
- Web前端开发最佳实践(2):前端代码重构
前言 代码重构是业内经常讨论的一个热门话题,重构指的是在不改变代码外部行为的情况下进行源代码修改,所以重构之前需要考虑的是重构后如何才能保证外部行为不改变.对于后端代码来说,可以通过大量的自动化测试来 ...
- 如何让你的JavaScript代码更加语义化
语义化这个词在 HTML 中用的比较多,即根据内容的结构化选择合适的标签.其作用不容小觑: 赋予标签含义,让代码结构更加清晰,虽然我们可以在标签上添加 class 来标识,但这种通过属性来表示本体的形 ...
- ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(十二) 代码重构使用反射工厂解耦(一)缓存切换
前言 上一篇中,我们用了反射工厂来解除BLL和UI层耦合的问题.当然那是最简单的解决方法,再复杂一点的程序可能思路相同,但是在编程细节中需要考虑的就更多了,比如今天我在重构过程中遇到的问题.也是接下来 ...
- 编写更加稳定/可读的javascript代码
每个人都有自己的编程风格,也无可避免的要去感受别人的编程风格--修改别人的代码."修改别人的代码"对于我们来说的一件很痛苦的事情.因为有些代码并不是那么容易阅读.可维护的,让另一个 ...
- 深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点
深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点 2011-12-28 23:00 by 汤姆大叔, 139489 阅读, 119 评论, 收藏, 编辑 才华横溢的 ...
- 高质量JavaScript代码书写基本要点
翻译-高质量JavaScript代码书写基本要点 by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/ ...
- 推荐五款优秀的PHP代码重构工具
在软件工程学里,重构代码一词通常是指在不改变代码的外部行为情况下而修改源代码.软件重构需要借助工具完成,而重构工具能够修改代码同时修改所有引用该代码的地方.本文收集了五款出色的PHP代码重构工具,以帮 ...
- [转] 翻译-高质量JavaScript代码书写基本要点 ---张鑫旭
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1173 原文作者:St ...
随机推荐
- vue 跳转并传参,实现数据实时更新
原文链接:点我 比如我现在在页面A跳转到页面B,A中的router-link :to={path:’B’,params:{id:’5’}} 求助:在页面B中的mounted生命周期函数中使用this. ...
- 8) drf 三大认证 认证 权限 频率
一.三大认证功能分析 1)APIView的 dispath(self, request, *args, **kwargs) 2)dispath方法内 self.initial(request, *ar ...
- ModuleNotFoundError: No module named 'pip'的解决方案
python在通过cmd安装pandas时遇到ModuleNotFoundError: No module named 'pip'的报错. 网上查询后通过如下两行cmd命令解决了 python -m ...
- P1714切蛋糕(不定区间最值)
题面 今天是小Z的生日,同学们为他带来了一块蛋糕.这块蛋糕是一个长方体,被用不同色彩分成了N个相同的小块,每小块都有对应的幸运值. 小Z作为寿星,自然希望吃到的第一块蛋糕的幸运值总和最大,但小Z最多又 ...
- Bootstrap初识
目录 概述 快速入门 响应式布局 CSS样式和JS插件 全局CSS样式 组件 插件 案例:黑马旅游网 概述 概念:一个前端开发的框架,Bootstrap是美国Twitter公司的设计师Mark Ott ...
- docker-compose安装rabbitmq
编写时间:2020-05-08 参考文档:docker安装rabbitmq 1. 编写docker-compose.yml version: '3' services: rabbitmq: image ...
- 按照这些优化技巧来写 SQL,连公司 DBA 也鼓掌称赞!
原文链接:按照这些优化技巧来写 SQL,连公司 DBA 也鼓掌称赞! 刚毕业的我们,都以为使用 MySQL 是非常的简单的,无非都是照着 [select from where group by ord ...
- js函数传递参数的方式------传值与传递指针
原则: 1. 基本类型:传值 2. 对象:传递指针 应用场景之一: 用jq选择器获取某个div后(例如:element),准备进行某些修改,之后添加到页面中去. 采取例一的方式,append后发现修改 ...
- STM32学习笔记——GPIO
单片机型号STM32F407VET6. 概述 GPIO的分类: 可接受5V输入的(FT),绝大多数引脚都是: 只能接受3.3V输入的(TTa),只有PA4和PA5,就是DAC输出的两个引脚: 其他,包 ...
- X Error:BadDrawable (individ Pixmap or Window parameter 9)
#描述 平台:aarch64 系统:ubuntu16.04.02 Qt Version:4.8.7 Qt程序可以正常运行,界面渲染出现问题以及乱码,控制提示错误内容: "unable to ...