您的位置:首页 > Web前端 > JavaScript

JavaScript代码编写风格

2015-01-06 15:46 267 查看

JavaScript 编码风格



通常, 使用
functionNamesLikeThis
,
variableNamesLikeThis
,
ClassNamesLikeThis
,
EnumNamesLikeThis
,
methodNamesLikeThis
, 和
SYMBOLIC_CONSTANTS_LIKE_THIS
.

展开见细节.

属性和方法

文件或类中的 私有 属性, 变量和方法名应该以下划线 "_" 开头.
保护 属性, 变量和方法名不需要下划线开头, 和公共变量名一样.

更多有关 私有 和 保护的信息见,
visibility.

方法和函数参数

可选参数以
opt_
开头.

函数的参数个数不固定时, 应该添加最后一个参数
var_args
为参数的个数. 你也可以不设置
var_args
而取代使用
arguments
.

可选和可变参数应该在
@param
标记中说明清楚. 虽然这两个规定对编译器没有任何影响, 但还是请尽量遵守

Getters 和 Setters

Getters 和 setters 并不是必要的. 但只要使用它们了, 就请将 getters 命名成
getFoo()
形式, 将 setters 命名成
setFoo(value)
形式. (对于布尔类型的 getters, 使用
isFoo()
也可.)

命名空间

JavaScript 不支持包和命名空间.

不容易发现和调试全局命名的冲突, 多个系统集成时还可能因为命名冲突导致很严重的问题. 为了提高 JavaScript 代码复用率, 我们遵循下面的约定以避免冲突.

为全局代码使用命名空间

在全局作用域上, 使用一个唯一的, 与工程/库相关的名字作为前缀标识. 比如, 你的工程是 "Project Sloth", 那么命名空间前缀可取为
sloth.*
.

var sloth = {};

sloth.sleep = function() {
...
};


许多 JavaScript 库, 包括
the Closure Library and
Dojo toolkit 为你提供了声明你自己的命名空间的函数. 比如:

goog.provide('sloth');

sloth.sleep = function() {
...
};


明确命名空间所有权

当选择了一个子命名空间, 请确保父命名空间的负责人知道你在用哪个子命名空间, 比如说, 你为工程 'sloths' 创建一个 'hats' 子命名空间, 那确保 Sloth 团队人员知道你在使用
sloth.hats
.

外部代码和内部代码使用不同的命名空间

"外部代码" 是指来自于你代码体系的外部, 可以独立编译. 内外部命名应该严格保持独立. 如果你使用了外部库, 他的所有对象都在
foo.hats.*
下, 那么你自己的代码不能在
foo.hats.*
下命名, 因为很有可能其他团队也在其中命名.

foo.require('foo.hats');

/**
* WRONG -- Do NOT do this.
* @constructor
* @extend {foo.hats.RoundHat}
*/
foo.hats.BowlerHat = function() {
};


如果你需要在外部命名空间中定义新的 API, 那么你应该直接导出一份外部库, 然后在这份代码中修改. 在你的内部代码中, 应该通过他们的内部名字来调用内部 API , 这样保持一致性可让编译器更好的优化你的代码.

foo.provide('googleyhats.BowlerHat');

foo.require('foo.hats');

/**
* @constructor
* @extend {foo.hats.RoundHat}
*/
googleyhats.BowlerHat = function() {
...
};

goog.exportSymbol('foo.hats.BowlerHat', googleyhats.BowlerHat);


重命名那些名字很长的变量, 提高可读性

主要是为了提高可读性. 局部空间中的变量别名只需要取原名字的最后部分.

/**
* @constructor
*/
some.long.namespace.MyClass = function() {
};

/**
* @param {some.long.namespace.MyClass} a
*/
some.long.namespace.MyClass.staticHelper = function(a) {
...
};

myapp.main = function() {
var MyClass = some.long.namespace.MyClass;
var staticHelper = some.long.namespace.MyClass.staticHelper;
staticHelper(new MyClass());
};


不要对命名空间创建别名.

myapp.main = function() {
var namespace = some.long.namespace;
namespace.MyClass.staticHelper(new namespace.MyClass());
};


除非是枚举类型, 不然不要访问别名变量的属性.

/** @enum {string} */
some.long.namespace.Fruit = {
APPLE: 'a',
BANANA: 'b'
};

myapp.main = function() {
var Fruit = some.long.namespace.Fruit;
switch (fruit) {
case Fruit.APPLE:
...
case Fruit.BANANA:
...
}
};


myapp.main = function() {
var MyClass = some.long.namespace.MyClass;
MyClass.staticHelper(null);
};


不要在全局范围内创建别名, 而仅在函数块作用域中使用.

文件名

文件名应该使用小写字符, 以避免在有些系统平台上不识别大小写的命名方式. 文件名以
.js
结尾, 不要包含除
-

_
外的标点符号(使用
-
优于
_
).
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: