0
点赞
收藏
分享

微信扫一扫

JavaScript:编程风格

灯火南山 2022-01-13 阅读 89

编程风格(上)

在这里插入图片描述

“编程风格”(programming style)指的是编写代码的样式规则。不同的程序员,往往有不同的编程风格。

有人说,编译器的规范叫做“语法规则”(grammar),这是程序员必须遵守的;而编译器忽略的部分,就叫“编程风格”(programming style)好的编程风格有助于写出质量更高、错误更少、更易于维护的程序。

所以,编程风格的选择要考虑如何尽量使代码清晰易读、减少出错

缩进

行首的空格和Tab键,都可以产生代码缩进效果(indent)

Tab键可以节省击键次数,但不同的文本编辑器对Tab的显示不尽相同,有的显示四个空格,有的显示两个空格,所以有人觉得,空格键可以使得显示效果更统一。

无论你选择哪一种方法,都是可以接受的,要做的就是始终坚持这一种选择。不要一会使用Tab键,一会使用空格键。

VSCode修改Tab默认缩进
在这里插入图片描述
在这里插入图片描述

区块

如果循环和判断的代码只有一行,JavaScript允许该区块(block)省略大括号。

if(a)
 b();
 c();

上面代码的原意可能是下面这样

if(a){
 b();
 c();
}

但是,实际效果却是下面这样

if(a){
 b();
}
 c();

因此,建议总是使用大括号表示区块

圆括号

圆括号(parentheses)在JavaScript中有两种作用,一种表示函数的调用,另一种表示表达式的组合(grouping)

//圆括号表示函数的调用
console.log('abc');

//圆括号表示表达式的组合
(1+2)*3

建议可以用空格,区分这两种不同的括号。

  • 表示函数调用时,函数名与左括号之间没有空格。
  • 表示函数定义时,函数名与左括号之间没有空格。
  • 其他情况时,前面位置的语法元素与左括号之间,都有一个空格。

行尾的分号

分号表示一条语句的结束。JavaScript允许省略行尾的分号。事实上,确实有一些开发者行尾从来不写分号,建议还是不要省略这个分号。

全局变量

JavaScript最大的语法缺点,可能就是全局变量对于任何一个代码块,都是可读可写。这对代码的模块化和重复使用,非常不利。

因此,建议避免使用全局变量。如果不得不使用,可以考虑用大写字母表示变量名,这样更容易看出这是全局变量,比如UPPER_CASE.

编程风格(下)

在这里插入图片描述

变量声明

JavaScript会自动将变量声明"提升"(hoist)到代码块(block)的头部。

if(!x){
 var x = {};
}
//等同于
var x;
if(!x){
 x = {};
}

这意味着,变量xif代码块之前就存在了。为了避免可能出现的问题,最好把变量声明都放在代码块的头部。

相等和严格相等

JavaScript有两个表示相等的运算符:“相等”(==)和“严格相等”(===)。相等运算符会自动转换变量类型,造成很多意想不到的情况

0 == '' //true
1 == true //true
2 == true //false
0 == '0' //true
false == 'false' //false
false == '0' //true
'\t\r\n' == 0 //true 

因此,建议不要使用相等运算符(==),只使用严格相等运算符(===

语句和合并

有些程序员追求简洁,喜欢合并不同目的的语句。比如,原来的语句是

a = b;
if(a){
 //...
}

他喜欢写成下面这样

if(a = b){
 //...
}

虽然语句少了一行,但是可读性大打折扣,而且会造成误读,让别人误解这行代码的意思是下面这样

if(a === b){
 //...
}

建议不要将不同目的的语句,合并成一行

自增和自减运算符

自增(++)和自减(--)运算符,放在变量的前面或后面,返回的值不一样,很容易发生错误。事实上,所有的++运算符都可以用+= 1代替

++x
//等同于
x += 1;

改用+= 1,代码变得更清晰了。
建议自增(++)和自减(--)运算符尽量使用+=-=代替

举报

相关推荐

0 条评论