书写高质量的代码之可维护性

前两天提到过解耦这个高级的词汇，今天又看到了，而且有了更深入的理解，解耦是提高代码可维护性的一个重要方法。

可维护的代码有哪些特征？
- 可理解性——其他人可以轻易的理解你的代码，而不需要你的完整解释
- 直观性——代码中的东西一看就能明白，而不管其操作多么浮躁
- 可适应性——代码以一种数据上的变化不要求完全重写的方法撰写
- 可扩展性——在代码架构上已经考虑到未来允许对核心功能进行扩展
- 可调试性——当有错误出现时，代码能够提供足够多的信息尽可能直观的确定问题所在
可维护性代码的基本特征如上所列，下面一一说明怎么实现这些特征。
代码约定
1. 可读性要提高代码的可读性，首先要形成良好的代码风格，风格统一的缩进就显得尤为重要了，这在团队协作中是非常值得关注的问题。由于制表符在不同的文本编辑器中显示的效果不同，通常会试用若干空格而非制表符来进行缩进。可读性的另一方面是注释，合理的注释不仅能够让他人更好的理解我们的代码，对于日后的重构或更改也是非常重要的。那么一般需要在哪些地方进行注释呢？如下所示：
  - 函数和方法——每个函数或方法都应该包含一个注释，描述其目的和用于完成任务所可能使用的算法。
  - 大段的代码——在大段代码的前面放一个注释描述这段代码的功能或任务，方便他人朝这个思路去理解你的代码。
  - 复杂的算法——这不仅能帮助他人理解你的代码，也能帮助自己日后重新阅读时理解。
  - Hack——对付不同的浏览器兼容问题时所采用的hack也应该添加上注释。
2. 变量和函数命名
  - 变量名应该为名词如person。
  - 函数名应该以动词开头，比如getName()。返回布尔类型值的函数一般以is开头，如isArray()。
  - 变量和函数都应该使用合乎逻辑的名字，不要担心长度，长度问题可以通过压缩处理。
3. 变量类型透明 javascript变量是松散类型的，很容易就忘记变量所对应包含的数据类型。合适的命名方式可以一定程度的改善这个问题，但这还不够，一般会通过下面三种方式来表示变量数据类型：
  - 初始化当定义了一个变量之后，介意给它初始化为一个值，来暗示它将来应该如何使用，如下所示
```
var dog=true;//布尔值
var num=1;//数字
var str="";//字符串
var person=null;//对象
初始化为一个特定的数据类型合一很好的知名变量的类型，但缺点是他无法用于函数声明中的函数参数
```
  - 使用匈牙利标记法来指定变量的类型这种方式应该是为最多开发人员所接受的，想我上一篇提到的昂天前辈的代码，就是采用的这种格式，就是在变量名之前加上一个或多个字符来表示数据类型，一般使用"o"表示对象，"s"表示字符串"，"i"代表整数，"f"代表浮点数，"b"代表布尔型，如下所示：
```
var bDog //布尔型
,iNum  //整数
,sStr  //字符串
,oPerson  //对象
```
    在我看来，这种方式应该是最佳的方案，以后就以这种方式来规范自己的变量命名了。
  - 使用类型注释类型注释放在变量名的右边，但在初始化的前面，我觉得这种方式比较麻烦，而且在内部使用/**/注释，这也是不推荐使用的，容易和多行注释产生冲突，就不在这写了，不推荐使用这种方式。
4. 松散耦合
  1. 解耦HTML/JAVASCRIPT 直接写在HTML中的Javascript，使用包含内联代码的 //使用内联javascript代码 <script type="text/javascript"> document.write("hello,world"); </script> //使用事件处理程序 <input onclick="doSomething()" type="button" value="clickme" /> 另外，应该避免在javascript中创建大量HTML，HTML呈现也应该尽可能与javascript保持分离。
  2. 解耦CSS/JAVASCRIPT 最常见的就是用javascript操作样式了，这我在上一篇文章中也提到了，最佳方案便是通过动态更改样式类而非特定的样式来实现。另一种紧密耦合只会在IE中出现，即在ｃｓｓ中使用javascript表达式，它们不能跨浏览器兼容。记住这条原则：显示问题的唯一来源应该是css，行为问题的唯一来源应该是javascript。
  3. 解耦应用逻辑/事件处理程序简单来说，就是把判断的部分和执行的部分分离开来，如下所示：
```
function addTen(){
num=10*MATH.Random();
if(num>5){
num+=10;
}else
{}
```
    简单的分离后，应该像下面这样：
```
function isBigfive(){
var num=10*MATH.Random();
if(num>5){
addTen(num);
}
function addTen(num){
num+=10;
}
```
    这样就达到了分离应用逻辑和事件处理程序的目的了。

posted @ 2013-03-31 23:58 echoHUST 阅读(463) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

永远年轻

BeYoung

书写高质量的代码之可维护性

公告