微信小程序开发规范文档-JavaScript格式规范
前奏
约定JavaScript使用ES6标准开发
wxs(WeiXin Script)和JavaScript是不同的语言,有自己的语法,wxs请参考wxs文档,这里的规范仅针对js。
变量命名
关于变量命名,主流分为驼峰式命名和下划线式命名两大阵营。我们约定,统一使用驼峰式命名。
- 推荐写法
let userId = 654321;
function getUserInfo () {
....
} - 不推荐写法
let user_id = 654321;
function get_user_info () {
....
}
分号
尽管现在JavaScript引擎知道该在什么情况下自动添加分号,由于项目历史原因和避免代码压缩时产生不必要的问题,我们约定使用分号。分号紧跟代码的最后一个字符。
- 推荐写法
let loading = -1; - 不推荐写法
let loading = -1 ;
逗号
逗号分割列表时,逗号放置在当前行的末尾。
- 推荐写法
let bar = 1,
foo = 2; - 不推荐写法
let bar = 1
, foo = 2;
数组(或对象)的最后一个元素(或属性)后面的逗号是拖尾逗号,示例:
let o = {
a: 1,
b: 2, // 拖尾逗号
}
对于数组和对象,最后一个元素或属性与右括号]或}不在同一行时,可以(但不要求)使用拖尾逗号;在同一行时,禁止使用拖尾逗号。
- 推荐写法
let arr = ['name',
'age',
'gender',
]
let o1 = {a: 1,b: 2};
let o2 = {
a: 1,
b: 2,
}; - 错误写法
let arr = ['name','age','gender',]
let o1 =
缩进
统一使用2个空格字符进行代码缩进。
空格
操作符
操作符前后加一个空格字符。
- 推荐写法
let a = 1 + 2; - 不推荐写法
let a = 1+2;
逗号
同一行内代码用到逗号,逗号后面加一个空格字符,提高代码可读性。
- 推荐写法
let bar = 1, foo = 2;
let arr = [1, 2, 3, 4, 5]; - 不推荐写法
let bar = 1,foo = 2;
let arr = [1,2,3,4,5]
函数
函数声明式声明函数时,函数名与参数括号()连在一起,之间不加空格;参数括号()与函数体的左大括号{之间一个空格字符。
-
推荐写法
function getInfo(userId) {
...
} -
不推荐写法
function getInfo1 (userId) {
...
}function getInfo2(userId){ ... }
函数字面量里,关键字function与参数括号()之间一个空格字符,参数括号()与函数体的左大括号{之间一个空格字符。
-
推荐写法
let getInfo = function (userId) {
...
} -
不推荐写法
let getInfo1 = function(userId) {
...
}let getInfo2 = function(userId){ ... }
函数调用时,禁止有空格。
-
推荐写法
getInfo(); -
错误写法
getInfo ();
对象字面量
对象字面量的属性名和冒号:之间不能有空格字符,冒号:和属性值之间一个空格字符。
- 推荐写法
let o1 = { a: 1, b: 2, c: 3 }
let o2 = {
e: 5,
f: 6,
g: 7,
} - 不推荐写法
let o1 = { a:1, b :2, c : 3}
let o2 = {
e:5,
f :6,
g : 7,
}
对象字面量在一行内时,左括号{和右括号}与代码各间隔一个空格字符。 - 推荐写法
let o1 = - 不推荐写法
let o1 =
单行代码
在单行代码中使用空格。
- 推荐写法
function foo() { return true }
if (true) - 不推荐写法
function foo(){return true}
if(true)
代码块
大括号{}包裹起来的代码叫代码块,示例:
{
let userId = 654321;
}
代码块前统一加一个空格字符
-
推荐写法
if (true) {
return '成功!'
}function getInfo() { ... }
-
不推荐写法
if (true){
return '成功!'
}function getInfo(){ ... }
计算属性
在对象的计算属性内,禁止有空格。
- 推荐写法
obj['name'] - 不推荐写法
obj['name' ]
obj[ 'name']
空行
空行对分离代码逻辑有帮助,但过多的空行会占据太多的屏幕空间,影响代码可读性。我们约定,最大连续空行数为2。
-
推荐写法
if(true) {
console.log('成功!');
}function getUserInfo () { ... }
-
不推荐写法
if(true) {
console.log('成功!');
}function getUserInfo () { ... }
在非空文件中,拖尾空行可以减少版本控制时的代码冲突。
-
推荐写法
function getUserInfo () {
...
}// ↑上面一行是空行
-
不推荐写法
function getUserInfo () {
...
}
大括号{}风格
用来描述大括号{}与代码块相对位置的方法很多,如下:
-
风格一
if (true) {
console.log('true');
} else {
console.log('false');
} -
风格二
if (true) {
console.log('true');
}
else {
console.log('false');
} -
风格三
if (true)
{
console.log('true');
}
else
{
console.log('false');
}我们约定,使用风格一。