javascript 基本编码规范

1.缩进(Indentation)

采用四个空格代码Tab 进行缩进

使用缩进的地方:

函数体、循环(do,while,for,for-in)、if、switch,以及对象字面中的对象属性。示例:

 1 function outer(a, b) {
 2     var c = 1,
 3         d = 2,
 4         inner;
 5     if (a > b) {
 6         inner = function () {
 7             return {
 8                 r: c - d
 9             };
10         };
11     } else {
12         inner = function () {
13             return {
14                 r: c + d
15             };
16         };
17     }
18     return inner;
19 }

PS:代码没有缩进基本上就不能读了。唯一糟糕的事情就是不一致的缩进,因为它看上去像是遵循了规范,但是可能一路上伴随着混乱和惊奇。重要的是规范地使用缩进。

2.花括号{}

花括号(亦称大括号,下同)应总被使用,即使在它们为可选的时候。技术上将,在in或是for中如果语句仅一条,花括号是不需要的,但是你还是应该总是使用它们,这会让代码更有持续性和易于更新。

3.

3.空格(White Space)

空格的使用同样有助于改善代码的可读性和一致性。在写英文句子的时候,在逗号和句号后面会使用间隔。在JavaScript中,你可以按照同样的逻辑在列表模样表达式(相当于逗号)和结束语句(相对于完成了“想法”)后面添加间隔。

适合使用空格的地方包括:

  • for循环分号分开后的的部分:如for (var i = 0; i < 10; i += 1) {...}
  • for循环中初始化的多变量(i和max):for (var i = 0, max = 10; i < max; i += 1) {...}
  • 分隔数组项的逗号的后面:var a = [1, 2, 3];
  • 对象属性逗号的后面以及分隔属性名和属性值的冒号的后面:var o = {a: 1, b: 2};
  • 限定函数参数:myFunc(a, b, c)
  • 函数声明的花括号的前面:function myFunc() {}
  • 匿名函数表达式function的后面:var myFunc = function () {};

使用空格分开所有的操作符和操作对象是另一个不错的使用,这意味着在+, -, *, =, <, >, <=, >=, ===, !==, &&, ||, +=等前后都需要空格。

最后需要注意的一个空格——花括号间距。最好使用空格:

  • 函数、if-else语句、循环、对象字面量的左花括号的前面({)
  • else或while之间的右花括号(})

空格使用的一点不足就是增加了文件的大小,但是压缩无此问题。

有一个经常被忽略的代码可读性方面是垂直空格的使用。你可以使用空行来分隔代码单元,就像是文学作品中使用段落分隔一样。

4.命名规范

另一种方法让你的代码更具可预测性和可维护性是采用命名规范。这就意味着你需要用同一种形式给你的变量和函数命名。下面是建议的一些命名规范,你可以原样采用,也可以根据自己的喜好作调整。同样,遵循规范要比规范是什么更重要。

以大写字母写构造函数(Capitalizing Constructors)

JavaScript并没有类,但有new调用的构造函数:

1 var adam = new Person();

因为构造函数仍仅仅是函数,仅看函数名就可以帮助告诉你这应该是一个构造函数还是一个正常的函数。命名构造函数时首字母大写具有暗示作用,使用小写命名的函数和方法不应该使用new调用:

1 function MyConstructor() {...}
2 function myFunction() {...}

分隔单词(Separating Words)

当你的变量或是函数名有多个单词的时候,最好单词的分离遵循统一的规范,有一个常见的做法被称作“驼峰(Camel)命名法”,就是单词小写,每个单词的首字母大写。

对于构造函数,可以使用大驼峰式命名法(upper camel case),如MyConstructor()。对于函数和方法名称,你可以使用小驼峰式命名法(lower camel case),像是myFunction(), calculateArea()和getFirstName()。

要是变量不是函数呢?开发者通常使用小驼峰式命名法,但还有另外一种做法就是所有单词小写以下划线连接:例如,first_name, favorite_bands, 和 old_company_name,这种标记法帮你直观地区分函数和其他标识——原型和对象。

ECMAScript的属性和方法均使用Camel标记法,尽管多字的属性名称是罕见的(正则表达式对象的lastIndex和ignoreCase属性)。

其它命名形式(Other Naming Patterns)

有时,开发人员使用命名规范来弥补或替代语言特性。例如,JavaScript中没有定义常量的方法(尽管有些内置的像Number, MAX_VALUE),所以开发者都采用全部单词大写的规范来命名这个程序生命周期中都不会改变的变量,如:

1 // 珍贵常数,只可远观
2 var PI = 3.14,
3     MAX_WIDTH = 800;

还有另外一个完全大写的惯例:全局变量名字全部大写。全部大写命名全局变量可以加强减小全局变量数量的实践,同时让它们易于区分。

另外一种使用规范来模拟功能的是私有成员。虽然可以在JavaScript中实现真正的私有,但是开发者发现仅仅使用一个下划线前缀来表示一个私有属性或方法会更容易些。考虑下面的例子:

01 var person = {
02     getName: function () {
03         return this._getFirst() + ‘ ‘ this._getLast();
04     },
05  
06     _getFirst: function () {
07         // ...
08     },
09     _getLast: function () {
10         // ...
11     }
12 };

在此例中,getName()就表示公共方法,部分稳定的API。而_getFirst()和_getLast()则表明了私有。它们仍然是正常的公共方法,但是使用下划线前缀来警告person对象的使用者这些方法在下一个版本中时不能保证工作的,是不能直接使用的。注意,JSLint有些不鸟下划线前缀,除非你设置了noman选项为:false。

下面是一些常见的_private规范:

  • 使用尾下划线表示私有,如name_和getElements_()
  • 使用一个下划线前缀表_protected(保护)属性,两个下划线前缀表示__private?(私有)属性
  • Firefox中一些内置的变量属性不属于该语言的技术部分,使用两个前下划线和两个后下划线表示,如:__proto__和__parent__。

注释(Writing Comments)

你必须注释你的代码,即使不会有其他人向你一样接触它。通常,当你深入研究一个问题,你会很清楚的知道这个代码是干嘛用的,但是,当你一周之后再回来看的时候,想必也要耗掉不少脑细胞去搞明白到底怎么工作的。

很显然,注释不能走极端:每个单独变量或是单独一行。但是,你通常应该记录所有的函数,它们的参数和返回值,或是任何不寻常的技术和方法。要想到注 释可以给你代码未来的阅读者以诸多提示;阅读者需要的是(不要读太多的东西)仅注释和函数属性名来理解你的代码。例如,当你有五六行程序执行特定的任务, 如果你提供了一行代码目的以及为什么在这里的描述的话,阅读者就可以直接跳过这段细节。没有硬性规定注释代码比,代码的某些部分(如正则表达式)可能注释要比代码多。

最重要的习惯,然而也是最难遵守的,就是保持注释的及时更新,因为过时的注释比没有注释更加的误导人。

来源:http://www.nowamagic.net/librarys/veda/detail/1629

时间: 2024-10-12 17:11:38

javascript 基本编码规范的相关文章

[转]JavaScript程序编码规范

原文:http://javascript.crockford.com/code.html 作者:Douglas Crockford 译文:http://www.yeeyan.com/articles/view/cloudwater/4042 译者:cloudwater 更新:2009-12-13 01:08:29 这是一套适用于JavaScript程序的编码规范.它基于Sun的Java程序编码规范.但进行了大幅度的修改, 因为JavaScript不是Java. 软件的长期价值直接源于其编码质量.

总结的javascript编码规范(一)

今天看了<编写高质量的javascript>的第一部分,总结了一些javascript的编码规范. 一.格式化 1.使用4个空格来缩进层级. 注:由于有些操作系统或编译环境对于tab(制表符)的处理不尽相同,而空格无差异,所以使用空格来进行缩进. 2.每条语句的结尾都应加分号. 注:红宝书中也说过,为了防止压缩错误,最好不要省略. 3.每行的长度不应该超过80个字符. 4.若长度超过限制,可以在运算符后换行. 5.空行:方法和方法之间需要空行,方法和局部变量之间需要空行,注释之前需要空行,逻辑

网易前端JavaScript编码规范

在多年开发邮箱webmail过程中,网易邮箱前端团队积累了不少心得体会,我们开发了很多基础js库,实现了大量前端效果组件,开发了成熟的opoa框架以及api组件,在此向大家做一些分享.今天想先和大家聊聊javascript的编码规范. 总所周知,javascript是一种语法极其灵活的语言.javascript在设计之初就只是用来为HTML添加动态效果的.由于他动态,弱类型 等特性,以及不同浏览器的兼容性问题,造成了开发成本要比java等语言要高很多.正因为它太灵活,我们制定了适用于网易邮箱的j

浅谈 JavaScript 编程语言的编码规范

对于熟悉 C/C++ 或 Java 语言的工程师来说,JavaScript 显得灵活,简单易懂,对代码的格式的要求也相对松散.很容易学习,并运用到自己的代码中.也正因为这样,JavaScript 的编码规范也往往被轻视,开发过程中修修补补,最终也就演变成为后续维护人员的恶梦.软件存在的长期价值直接与编码的质量成比例.编码规范能帮助我们降低编程中不必要的麻烦.而 JavaScript 代码是直接发送给客户浏览器的,直接与客户见面,编码的质量更应该受到关注. 本文浅谈 JavaScript 编程中关

前端Javascript编码规范

在多年开发邮箱webmail过程中,网易邮箱前端团队积累了不少心得体会,我们开发了很多基础js库,实现了大量前端效果组件,开发了成熟的opoa框架以及api组件,在此向大家做一些分享.今天想先和大家聊聊javascript的编码规范. 总所周知,javascript是一种语法极其灵活的语言.javascript在设计之初就只是用来为HTML添加动态效果的.由于他动态,弱类型等特性,以及不同浏览器的兼容性问题,造成了开发成本要比java等语言要高很多.正因为它太灵活,我们制定了适用于网易邮箱的ja

web项目开发 之 前端规范 --- JavaScript编码规范

JavaScript编码规范 此文严格按照W3C规范和部分实际项目可读性,浏览器加载,性能等众多属性权衡,做出平时前端编码规范文档.供广大web工作者参考并实施,对维护和项目扩展升级都能省时省力. 场景:web前端开发中 一些Javascript的注意事项 和 规格建议: [参考百度资料 和个人一些总结] 1 前言 JavaScript 在百度一直有着广泛的应用,特别是在浏览器端的行为管理.本文档的目标是使 JavaScript 代码风格保持一致,容易被理解和被维护. 虽然本文档是针对 Java

javascript编码规范[原创]

一些命名规范书或js书命名规范章节,喜欢将命名规范跟语法混在一块例如: 1.使用“var”定义.初始化变量防止产生全局变量,多变量一块定义使用“,”(本身这种方式就很有争议). 2.结尾必加“;”防止js执行效果跟想象中不一样. 3.判断两数相等使用“===”不要使用“==”.(实际上==会出问题情况很少发生,而js的语法章节也会提及建议使用“===”) 等等导致规范过于冗长,在我看来,命名规范不应太多,而是将实地编码中最常用到的列出即可. 研究过一些框架低层代码.看完<编写可维护的代码>整理

学习一份百度的JavaScript编码规范

JavaScript编码规范 1 前言 2 代码风格 2.1 文件 2.2 结构 2.2.1 缩进 2.2.2 空格 2.2.3 换行 2.2.4 语句 2.3 命名 2.4 注释 2.4.1 单行注释 2.4.2 多行注释 2.4.3 文档化注释 2.4.4 类型定义 2.4.5 文件注释 2.4.6 命名空间注释 2.4.7 类注释 2.4.8 函数/方法注释 2.4.9 事件注释 2.4.10 常量注释 2.4.11 复杂类型注释 2.4.12 AMD 模块注释 2.4.13 细节注释 3

JavaScript 编码规范 之 函数表达式

! function () { var a = function () // 赋值一个函数表达式 { } , b = function () // b c 效果一样 都是返回一个拥有闭包的函数 { var time = +new Date ; return function () { ; console.log( time ) } }() , c = ( function () // 加上圆括号的原因 1 表示是立即执行 2 拥有闭包元素 { var time = +new Date ; ret