JavaScript 语句是否省略分号

2019-1-29 23:51| 作者: admin| 查看: 4521| 评论: 0|来自: 蚂蚁部落

关于JavaScript语句后面是否应该省略分号,有两种截然相反的意见。

一种意见是,语句后面应该时时刻刻使用分号,另一种则是尽量不使用分号,甚至完全不使用。

当然作为一种编码习惯,没有所谓的应该不应该,只有习惯不习惯,或者说喜欢不喜欢。

随着编码水平的提高,可能越来越多的人会觉得省略分号是更好的选择:

(1).编码省却了分号,也就省去一部分时间。

(2).代码的性能在某些情况下会更高一些。

本规范建议,如果是初学者或者水平还没有提高到一定程度,那么就在语句后面添加分号。

如果您已经达到比较高的水准,能够确保不会出错,那么可以尽可能的省略分号的使用。

其实加不加分号并不是重点,核心是要掌握如下两个知识点:

(1).何时可以省略语句后面的分号。

(2).在何种场景下省略分号会导致意外。

一.对换行处理:

JavaScript解析器会将换行看做当前语句的一部分,除非人为添加一个分号结束当前行语句。

当然,如果全都遵循上述规则,那么就没必要讨论本话题了,编码时肯定要强制添加分号。

大家知道,在很多上下文,语句最后的分号是可以省略的,看如下代码:

[JavaScript] 纯文本查看 复制代码
let webName="蚂蚁部落"
let address="青岛市南区";

webName变量声明的后面没有添加分号,JavaScript会将上述代码解析为:

[JavaScript] 纯文本查看 复制代码
let webName="蚂蚁部落";
let address="青岛市南区";

可以认为JavaScript解析器为第一行语句自动填补了分号。

二.换行处理的例外:

前文中介绍过,解析器会将换行看做当前语句的一部分处理,但并不总是这样。

那么可以利用这些例外情况,省略语句后面的分号,可以认为解析器自动填补了分号。

1.当前行与新的行构成非法语句:

[JavaScript] 纯文本查看 复制代码
let webName="蚂蚁部落"
let address="青岛市南区";

现在来分析一下,为什么解析器会在第一行的结尾自动添加分号。

因为解析器会将换行也看作为当前的语句,那么上述代码就可以表述为如下形式:

[JavaScript] 纯文本查看 复制代码
let webName="蚂蚁部落" let address="青岛市南区";

很明显,代码会报错,所以解析器会第一行的几位自动填补了分号。

利用这个特点,我们可以在一些上下文下省略语句后面的分号。

2.return与continue和break:

以return语句作为例子进行介绍,看如下代码实例:

[JavaScript] 纯文本查看 复制代码运行代码
function func(){
  return 
  "蚂蚁部落"
}
console.log(func());

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201901/29/235353e1jkr74kc878ypjc.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

代码的本意是函数返回字符串"蚂蚁部落",然而真正的返回值是undefined。

因为对于return语句,如果后面是换行,那么解析器会自动在后面添加一个分号。

continue和break也是同样的道理,这里不做介绍,更多内容可以参阅如下几篇文章:

(1).JavaScript return 语句一章节。

(2).JavaScript break与continue语句一章节。

3.++与--运算符:

这两个运算符既可以放在运算数的前面,也可以放在运算数的后面。

如果将它们置于运算数的后面,则需要放在一行,否则虽然可能不会报错,但会偏离运算初衷。

看如下代码:

[JavaScript] 纯文本查看 复制代码
a 
++ 
b;

我们的真正的目的可能是如下形式:

[JavaScript] 纯文本查看 复制代码
a ++ ;b;

但是实际解析的效果却是如下形式:

[JavaScript] 纯文本查看 复制代码
a;++b;

4.for循环语句:

循环语句头部小括号中的分号是绝对不能省略的,即便是参数没有填写也不能省略。

看如下代码实例如下:

[JavaScript] 纯文本查看 复制代码运行代码
let num=5;
for(;num<10;num++){
  console.log(num);
}

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201901/29/235517sedowwvz98yoeu8r.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

for循环语句的头部的分号是绝对不能省略的,更多内容参阅JavaScript for 循环语句一章节。

三.换行处理规则可能带来的问题:

如果以如下几个token作为一行的开头,可能会和上一行导致解析歧义。

虽然代码可能不会报错,但是结果却背离初衷,token罗列如下:

(1).括号

(2).方括号

(3).正则开头的斜杠

(4).加号

(5).减号

(6).字符串模板的反引号由于篇幅问题,不对上面的token挨个演示,仅演示比较常见的两个:

[JavaScript] 纯文本查看 复制代码
a = b
(function() {
   // code 
})()

上述代码会被JavaScript解析器解读为如下形式:

[JavaScript] 纯文本查看 复制代码
a = b(function() {
  // code
})();

本来是一个简单的变量赋值之后,然后一个自执行匿名函数,现在b却成了函数。

[JavaScript] 纯文本查看 复制代码
a = b
[1,2,3].forEach(function(item) {
  // code
});

上述代码会被解析为如下形式:

[JavaScript] 纯文本查看 复制代码
a = b[1,2,3].forEach(function(item) {
  // code
});

b变成了一个数组,原本的数组[1,2,3],通过逗号运算符运算后,变成了数组b的索引b[3]。

if else语句可能导致的问题:

有时候经常会对if else语句进行一些简写,不注意可能会导致错误。

看如下简单代码:

[JavaScript] 纯文本查看 复制代码
if (a > b)
else c = d

上述代码会报错,因为else不能跟在if的后面,这时候可以在if语句后面添加一个分号,生成一个空语句。

当然也可以添加一个空的大括号{},很明显添加一个分号更加省时省力,代码修改如下:

[JavaScript] 纯文本查看 复制代码
if (a > b);
else c = b

在if后面的添加一个分号,代码就不会再报错。


鲜花

握手

雷人

路过

鸡蛋

最新评论

返回顶部