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代码重构需要考虑的问题(一)的更多相关文章

  1. js基石之---易读、易复用、易重构的 JavaScript 代码规范

    易读.易复用.易重构的 JavaScript 代码规范 1.变量命名规范有意义 Bad: const yyyymmdstr = moment().format("YYYY/MM/DD&quo ...

  2. Web前端开发最佳实践(2):前端代码重构

    前言 代码重构是业内经常讨论的一个热门话题,重构指的是在不改变代码外部行为的情况下进行源代码修改,所以重构之前需要考虑的是重构后如何才能保证外部行为不改变.对于后端代码来说,可以通过大量的自动化测试来 ...

  3. 如何让你的JavaScript代码更加语义化

    语义化这个词在 HTML 中用的比较多,即根据内容的结构化选择合适的标签.其作用不容小觑: 赋予标签含义,让代码结构更加清晰,虽然我们可以在标签上添加 class 来标识,但这种通过属性来表示本体的形 ...

  4. ASP.NET SignalR 与 LayIM2.0 配合轻松实现Web聊天室(十二) 代码重构使用反射工厂解耦(一)缓存切换

    前言 上一篇中,我们用了反射工厂来解除BLL和UI层耦合的问题.当然那是最简单的解决方法,再复杂一点的程序可能思路相同,但是在编程细节中需要考虑的就更多了,比如今天我在重构过程中遇到的问题.也是接下来 ...

  5. 编写更加稳定/可读的javascript代码

    每个人都有自己的编程风格,也无可避免的要去感受别人的编程风格--修改别人的代码."修改别人的代码"对于我们来说的一件很痛苦的事情.因为有些代码并不是那么容易阅读.可维护的,让另一个 ...

  6. 深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点

    深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点 2011-12-28 23:00 by 汤姆大叔, 139489 阅读, 119 评论, 收藏, 编辑 才华横溢的 ...

  7. 高质量JavaScript代码书写基本要点

    翻译-高质量JavaScript代码书写基本要点 by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/ ...

  8. 推荐五款优秀的PHP代码重构工具

    在软件工程学里,重构代码一词通常是指在不改变代码的外部行为情况下而修改源代码.软件重构需要借助工具完成,而重构工具能够修改代码同时修改所有引用该代码的地方.本文收集了五款出色的PHP代码重构工具,以帮 ...

  9. [转] 翻译-高质量JavaScript代码书写基本要点 ---张鑫旭

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1173 原文作者:St ...

随机推荐

  1. ajax 技术

    ajax 技术 $.ajax({ url:"", type:'GET', success:function(data){ console.log(data); }, error:f ...

  2. TOP-K Problems

    最小的K个数 直接数组排序,取出前K个.复杂度\(O(nlogn)\). 分治 此题只要求出最小的K个数,并不要求这K个数有序. 我们可以借鉴快排中的partition做法,将比第K个数小的都放前面, ...

  3. CodeForces - 262C 贪心

    Maxim always goes to the supermarket on Sundays. Today the supermarket has a special offer of discou ...

  4. startUML简单使用教程

    最近在startUML上画图搞得我一个头两个大,找了一些比较实用的小方法分享给大家. 类图是可视化地表现类的属性和方法,以及类与类之间的关系. 1.类 a.类 普通实体类,它有对应的属性和方法: 双击 ...

  5. uniapp自定义简单省市区联动组件

    又双叒一个uniapp组件 最近有一个选择地址的需求,就写了一个省市区联动选择器. 选择日期使用的picker,就照着它简单的整了一个,使用网络请求城市数据,还用到了vuex组件数据共享. 本来自己整 ...

  6. 【Hadoop离线基础总结】Hue与Hive集成

    目录 1.更改hue的配置hue.ini 2.启动hive的metastore以及hiveserver2服务 3.启动hue进程,查看Hive是否与Hue集成成功 1.更改hue的配置hue.ini ...

  7. .net core HttpClient 使用之掉坑解析(一)

    一.前言 在我们开发当中经常需要向特定URL地址发送Http请求操作,在.net core 中对httpClient使用不当会造成灾难性的问题,这篇文章主要来分享.net core中通过IHttpCl ...

  8. docker磁盘空间不足解决办法

    docker磁盘空间不足解决办法 导入docker镜像时,错误提示:磁盘空间不足. 1.查看docker镜像存放目录空间大小 du -hs /var/lib/docker/ 2.停止docker服务. ...

  9. masonry中的make,remake,update

    - (void)viewDidLoad { [super viewDidLoad]; self.navigationController.navigationBar.translucent = NO; ...

  10. mybatis部分sql技巧

    1.mybatis中没有<=号,必须用<![CDATA[<=]]>表示.<update id="reduceNumber"> UPDATE se ...