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. webpack打包多入口配置

    在它的entry入口设置多文件入口即可,例: entry: { core: './src/core.js', design: './src/design.js' }, 单一出口输出: output: ...

  2. 网络流--最大流--Dinic模板矩阵版(当前弧优化+非当前弧优化)

    //非当前弧优化版 #include <iostream> #include <cstdio> #include <math.h> #include <cst ...

  3. Java—线程池ThreadPoolExecutor详解

    引导 要求:线程资源必须通过线程池提供,不允许在应用自行显式创建线程: 说明:使用线程池的好处是减少在创建和销毁线程上所花的时间以及系统资源的开销,解决资源不足的问题.如果不使用线程池,有可能造成系统 ...

  4. Nginx模块开发(1)————类helloworld

    Nginx看了一点了,准备写个helloworld试试,觉得只看书的话很多东西都乱乱的,晕晕的,印象不深. 我的helloworld模块的目的就是:能够在浏览器里输入http://你的ip地址/lcw ...

  5. 僵尸进程(zombie process)

    首先了解一下linux中进程的5大状态: R Running or runnable (on run queue)S Interruptible sleep (waiting for an event ...

  6. P1790 矩形分割(隐含的电风扇)

    描述:https://www.luogu.com.cn/problem/P1790 有一个长为a,宽为b的矩形(1≤a≤6,2≤b≤6).可以把这个矩形看作是a*b个小方格. 我们现在接到了这样的一个 ...

  7. 【Hadoop离线基础总结】HDFS入门介绍

    HDFS入门介绍 概述 HDFS全称为Hadoop Distribute File System,也就是Hadoop分布式文件系统,是Hadoop的核心组件之一. 分布式文件系统是横跨在多台计算机上的 ...

  8. 解决使用nlpir分词,遇到License过期问题

    问题:使用pynlpir分词,遇到License过期问题 抛出异常:pynlpir.LicenseError: Your license appears to have expired. Try ru ...

  9. {bzoj2338 [HNOI2011]数矩形 && NBUT 1453 LeBlanc}平面内找最大矩形

    思路: 枚举3个点,计算第4个点并判断是否存在,复杂度为O(N3logN)或O(N3α) 考虑矩形的对角线,两条对角线可以构成一个矩形,它们的长度和中点必须完全一样,于是将所有线段按长度和中点排序,那 ...

  10. Python自动生成100以内加减乘除混合运算题

    import random from random import choice ops = ('+','-','×','÷') ans = [] i=0 while i < 100 : op1 ...