编写可维护的JavaScript 收纳架

  若是你看过Nicolas C.Zakas写过的任何做品,你必须认可他是个彻彻底底的天才。也只有天才级的才能写出《JavaScript高级程序设计》让全部的前端攻城师人手一本。Nicolas C.Zakas除了对现代JavaScrpt技术的详细讲解,还倡导了不少最佳实践,包括渐进加强、可访问性、性能、扩展性和可维护性等。前端

  编写可维护的Javascript就意味着:消灭团队个体的差别达成总体的统一,以保持你们的代码风格一致和可读的、可维护性的、可扩展的。因此该系列收纳架作一个收纳整理。编程

 

  书从编码风格、编程实践以及自动化3个部分来说。ide

第一部分 编程风格函数

  编程风格的肯定会促成整个团队成员的高水准运做,由于全部的代码风格看起来极为相似就如同一我的编写。性能

在团队开发中,编程风格一致性变得尤其重要,缘由有:编码

  • 任何开发者都不在意某个文件的做者是谁,也没有必要花费额外的精力去理解代码的逻辑而且从新排版,由于全部代码的排版风格都是很是一致的,由于风格不一致会致使咱们打开代码文件的第一件事情不是当即工做,而是进行缩进的排版整理。
  • 能很容易的辨别出有问题的代码而且发现错误,若是全部的代码风格很像,当看到一段不同凡响的代码时,很肯能问题就出在这里。

  JSLint 和 JSHint 是两个检查编程风格的工做。不只找出代码中潜在的错误,还能对潜在的风格问题给予提示警告。JSLint是属于“顽固派”不接受你的自定义也就是不会为你作任何改变;JSHint是属于“受教派”能够接受你的自定义个性化的检查。spa

第一章 基本的格式化设计

  编程风格的核心就是基本的格式化规范,这些规范决定着如何编写高水准的代码。code

1.1 缩进层级blog

  缩进没有统一的共识二分红两派:

  • 使用制表符缩进。  
  • 使用空格缩进。
     只要不将二者混着用,保持一致即可。我的喜欢使用制表符Tab缩进。Zakas建议4个空格,或设置 制表符Tab 替换为 4个空格为一个缩进层。
 
1.2 语句结尾
  因为JavaScript分析器会自动插入机制,因此禁止省略分号和函数中的前“{”不该该换行。
  如:
// 原始代码
function getData() {
    return
    {
        title:"JavaScript",
        ...
    }
}

// 分析器将理解成
function getData() {
    return;
    {
        title:"JavaScript",
        ...
    }
}

// 推荐写法
function getData() {
    return {
        title:"JavaScript",
        ...
    }
}
View Code

 

1.3 行的长度

  行的长度不该该超过80个字符。

1.4 换行

  当一行达到了单行最大字符数或超过单屏时,应该手动换行。推荐在运算符后换行,下一行需增长两个层级的缩进(两个Tab/8个字符)]

1.5 空行

  空行推荐使用在:

  • 在每一个流控制语句以前(如if/for等)。
  • 在方法之间。
  • 在方法中局部变量和第一条语句之间。
  • 在多行或单行注释以前。
  • 在方法内的逻辑片断之间插入空行,提供可读性。
  • 在一段代码的语义和另外一段代码不相关之间,确保语义有关联的代码展示在一块儿 如:
// 不推荐写法
if(wl && wl.length){
    for (i=0,l=wl.length;i<l;++i) {
        ...
    }
}

// 推荐写法
if(wl && wl.length){

    for (i=0,l=wl.length;i<l;++i) {
        ...
    }
}
View Code

1.6 命名

  JavaScripe 核心 ECMAScript,便是遵守了驼峰式大小写。

  1.6.1 变量和函数

    变量名老是应该遵循驼峰大小写命名法,而且命名的前缀应当是名词,使得能够将变量和函数区分开。 如:

// 不推荐写法: 变量看起来像函数
var getCount=10;
var isFound=true;

// 推荐写法
var count=10;
var found=true;
View Code

    命名长度尽量短并能看词知意。

    常见参考:

    can        函数返回布尔值
    has       函数返回布尔值
    is          函数返回布尔值
    get        函数返回非布尔值
    set        函数用来保存值
 
  1.6.2 常量
    在ECMAScript 6 以前,JavaSCript 不存在真正的常量的概念。而后工做中仍然把变量用做成常量的。因为我是用C#的,若是根据C#的命名规则,约定常量首字母大写来区分, 如:
// 这是个人我的约定跟本书不一样(书是C语言使用大写字母和下划线命名)
var MaxCount=100;
var Url="http://www.cnblogs.com/";
View Code

 

  1.6.3 构造函数

    构造函数的命名是遵守 UpperCamelCase(大驼峰)命名法。

 

1.7 直接量

                                                                                          《-未完 待续-》

相关文章
相关标签/搜索