摘要：在平时的编程工作中，大多数程序员很少会关心细节问题，本文作者跨越多个语言，为大家总结了20条常规陷阱，并提供了很好的解决方案，供大家参考学习。

　　不管你现在的编程技能有多么的高超，曾经你也是个亦步亦趋，不断的学习的初学者。在编程这条曲折的道路上，我想你肯定犯过一些低级的错误、遇见过一些普通的编码陷阱。本文作者跨越多个语言，为大家总结了20条常规陷阱，并提供了解决方案。

　　JavaScript篇

　　1、不必要的DOM操作

　　例如下面这段代码：


1.// anti-pattern
2.for (var i = 0; i < 100; i++){ 
3.   var li = $("<li>").html("This is list item #" + (i+1)); 
4.   $("#someUL").append(li); 
5.}
 


　　这段代码对DOM进行了100次修改，并且创建了100个不必要的jQuery对象。正确的做法是使用一个文档片段，或者创建一个字符串，把100个<li>元素赋给该字符串。然后附加到HTML中。这样只需运行DOM一次，代码如下：


1.var liststring = ""; 
2.for (var i = 100; i > 0; i--){ 
3.   liststring += "<li>This is list item #" + (99- i); 
4.} 
5.document.getElementById("someUL").innerHTML(liststring);
 


　　正如上面所描述的一样，下面再提供一个方式，使用数组：


1.var liststring = "<li>"
2.var lis = []; 
3.for (var i = 100; i > 0; i--){ 
4.   lis.push("This is list item #" + (99- i)); 
5.} 
6.liststring += lis.join("</li><li>") + "</li>"; 
7.document.getElementById("someUL").innerHTML(liststring);
 


　　这是在JavaScript创建重复HTML快简单的方法，无需使用模板库或框架。

　　2、不一致的变量名和函数名

　　这个问题是非常重要的，尤其当你在别人的代码上工作时，一定要保持标识符（变量名和函数名）一致，例如下面这段代码：


1.var foo = "bar"; 
2.var plant = "green"; 
3.var car = "red";
 


　　通常，人们并不会设置变量名叫Something，这涉及到命名规则问题，命名应清晰明了，一目了然。很多编程语言地变量命名都使用大写。

　　下面是对函数的命名：


1.function subtractFive(number){ 
2.   return number - 5; 
3.}
 


　　语法结构清晰并且能起到解释性功能。

　　例如想要对给定的数字加5，仍采用上述命名模式，比如：


1.function addFive(number){ 
2.   return number + 5; 
3.}
 


　　有时，你会根据返回值命名，例如该函数要返回一个HTML字符串，那么可以命名为getTweetHTML()，如果函数只是做一些操作，无需返回值，那么可以在前面加一个do前缀。例如doFetchTweets()。

　　构造函数通常会遵循类原则，大写第一个字母：


1.function Dog(color){ 
2.   this.color = color; 
3.}


　　命名应带有描述性，比如操作型的函数在前面加do，另外要具备可读性和提示性。