虽然现在有很多代码质量的检测工具但是依然不能检测完全，一下几点是我们在写前端代码中经常遇到的问题。

重复的收集元素

在使用jQuery或者Zepto，原生的元素选择器的时候，重复收集元素。

$(".items").addClass("hide");$(".items").removeClass("hide");

这种问题遇到的比较多，其实在webstrom中会有红字提醒标示。告诉你不推荐你这样使用。

可以

var $items = $(".items");$items.addClass("hide");$items.removeClass("hide");

重复的条件判断

重复的条件计算很常见，但通常也是有一个通用的模式来避免它们。你可能会看到一段代码写成这样：

var performMiracle = function() {    // 如果浏览器支持A特征...    if(features.someFeature) {    }    // ... 如果不支持    else {    }};

这是可行的，但不是最高效的代码，上面的条件可能会多次计算。写成下面的样子会更好：

var performMiracle = features.someFeature ? function() {    // Plan A stuff} : function() {    // Plan B stuff};

重复的对象创建

相比较重复的操作，重复的对象创建更难发现，通常是表现在正则表达式上。看一下下面的这段代码：

function cleanText(dirty) {    // 去除SCRIPT tags    clean = dirty.replace(/
    
     ]*>([\s\S]*?)<\/script>/gi, "");    // Do some more cleaning, maybe whitespace, etc.    return clean;}
    

上面的代码会不断的重复创建一个新的(但是相同的)正则表达式对象，对于这种情况，如果你在这个函数的外部创建这个对象，就能避免这种情况的出现：

var scriptRegex = /
    
     ]*>([\s\S]*?)<\/script>/gi;function cleanText(dirty) {    // Get rid of SCRIPT tags    clean = dirty.replace(scriptRegex, "");    // Do some more cleaning, maybe whitespace, etc.    return clean;}
    

在上面的例子中，正则表达式对象只创建了一次，但多次使用——省了很多CPU处理。

---

以下为自己的常遇到收集整理

忘记声明数据类型

下面这份代码

function mean() {    var sum;    for (var i = 0; i < this.data.length; i++){        sum += this.data[i];    }    return sum / (this.data.length);}

乍一看没说明问题，但是返回的结果却是NaN；如果做number类型叠加记得声明 var sum = 0；没有什么大的错误就是很容易忽略的小问题。

手机设备事件绑定问题

手机设备事件绑定类型不正确，比如用click 在ios 设备上是失效的，应该换成 touchend或者 touchstart

如果需要的话可以用

$.bind('click touchend' ,function(event){...});

---

未完结