Joomla! 编码标准
JavaScript - Joomla 3.x
关于
编码标准
客户端语法风格指南
附录
目录
命名约定
使用描述性词语或简洁的短语作为名称。
变量和函数应使用驼峰命名法，以小写字母开头：likeThis
变量
使用描述变量内容的名称
var element = document.getElementById('elementId');
迭代器是例外情况
在循环中使用 i 作为索引（在需要嵌套迭代时使用后续字母）。
函数
使用描述函数功能的名称
function getSomeData() {
// statements
}保留字
不要将保留字用于其预期用途以外的任何用途。保留字列表：保留字
语法风格
缩进
- 不要混合使用制表符和空格。
- 制表符，4 个空格
空格
- 行尾或空行没有空格。
- 一元特殊字符运算符（例如！，++）在其操作数旁边不得有空格。
- 任何 , 和 ; 前面不得有空格。
- 任何用作语句终止符的 ; 必须位于行尾。
- 对象定义中属性名称后的任何 : 前面不得有空格。
- 三元条件中的 ? 和 : 两侧必须有空格。
- 空结构体中没有填充空格（例如，{}，[]，fn()）
- 每个文件末尾都有一个新行。
数组
var array = [ 'foo', 'bar' ];函数调用
foo( arg );具有多个参数的函数调用
foo( 'string', object );条件语句
if ( condition ) {
// statements
} else {
// statements
}while ( condition ) {
// statements
}for ( prop in object ) {
// statements
}例外
第一个或唯一的参数是对象、数组或回调函数。
第一个参数前没有空格
foo({
a: 'bar',
b: 'baz'
});foo(function() {
// statements
}, options ); // space after options argument以回调函数、对象或数组作为最后一个参数的函数
最后一个参数后没有空格。
foo( data, function() {
// statements
});逗号
在后面放置逗号
- 变量声明
- 键/值对
数组
不要包含尾随逗号，这将使数组的长度加 1。
否
array = [ 'foo', 'bar', ];是
array = [ 'foo', 'bar' ];分号
在预期的地方使用它们。
分号应包含在函数表达式的末尾，但不应包含在函数声明的末尾。
函数表达式
var foo = function() {
return true;
};函数声明
function foo() {
return true;
}引号
使用 ' 代替 "
变量
避免使用全局变量
否
foo = 'bar';否：隐式全局
function() {
foo = 'bar';
}是
var foo = 'bar';多个变量声明
使用一个 var 声明，并在换行符处用逗号分隔每个变量。
否
var foo = 'bar';
var bar = 'baz';
var baz = 'qux';是
var foo = 'bar',
bar = 'baz',
baz = 'qux';类型
字符串
- 连接长字符串。
- 在每个字符串末尾的结束引号前放置空格。
- 在每个后续字符串的末尾使用连接运算符。
var longString = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. ' +
'Sed placerat, tellus eget egestas tincidunt, lectus dui ' +
'sagittis massa, id mollis est tortor a enim. In hac ' +
'habitasse platea dictumst. Duis erat justo, tincidunt ac ' +
'enim iaculis, malesuada condimentum mauris. Vestibulum vel ' +
'cursus mauris.';数字
为了可读性，请使用 parseInt() 或 parseFloat() 而不是一元加号。
否
var count = +document.getElementById('inputId').value;是
var count = parseInt(document.getElementById('inputId').value);类型检查
- 字符串：
typeof object === 'string' - 数字：
typeof object === 'number' - 布尔值：
typeof object === 'boolean' - 对象：
typeof object === 'object' - 普通对象：
jQuery.isPlainObject( object ) - 函数：
jQuery.isFunction( object ) - 数组：
jQuery.isArray( object ) - 元素：
object.nodeType - null：
object === null - null 或 undefined：
object == null
未定义
- 全局变量：
typeof variable === 'undefined' - 局部变量：
variable === undefined - 属性：
object.prop === undefined
对象
使用字面量语法，而不是构造函数语法。
否
var myObj = new Object();是
var myObj = {};如果对象包含多个键/值对或数组作为值，则每个键/值对应位于其自己的行上。
var myObj = {
foo: 'bar',
bar: 'baz',
baz: 'qux'
};数组
使用字面量语法，而不是构造函数语法
否
var myArr = new Array();是
var myArr = [];如果您不知道数组长度，请使用 push 方法。这将替换当前数组。
var myArr = [];
myArr.push('foo');函数
链接方法调用
$('.someElement')
.hide()
.delay(1000)
.fadeIn();条件语句
如果使用三元语法
- 一个条件
- 任一评估的结果都是一个操作。
joomlaRocks ? 'This is true' : 'else it is false';否则，使用标准语法
if ( condition ) {
// statements
} else {
// statements
}将长度缓存在变量中以提高性能
var i,
j = myArr.length;
for ( i = 0; i < j; i++ ) {
// statements
}有多个条件时
if ( condition &&
condition2 &&
condition3 ) {
// statements
} else {
// statements
}相等性
使用严格相等运算符 ===，以便在比较中考虑类型。使用 == 可能产生误报。
// evaluates true
1 == "1"// evaluates false
1 === "1"代码块与多行语句
在包含多个语句的代码块上使用花括号。
包含一个语句的代码块
if ( test ) return false;包含多个语句的代码块
if ( test ) {
var foo = 'some string';
return foo;
}注释
单行
- 放在其引用的代码上方。
- 双斜杠和注释文本之间有一个空格。
// I am a single line comment.多行
- 放在其引用的代码上方。
- 打开标记放在第一行注释上方的行，关闭放在最后一行注释下方的行。
- 每行注释以两个星号后跟一个空格开头。
/*
** I am a multiline comment.
** Line two
** Line three
*/待办事项
- Switch 语句与其他方法（如对象）的比较
- 添加 jQuery 示例
- 仔细检查所有示例的准确性
在…的帮助下