前言

js语句末尾到底要不要加分号，早已形成了加分号党和不加分号党，而且吵得不可开交，各有各的道理，但是，你们都没有说到点上。如果你是不加分号党，来来来，先来执行几条语句。

案例

1，[前面不加分号

将下方代码拷贝到Chrome浏览器的控制台运行：

console.log('任意字符')
[1,2].forEach(v=>v);

得到

任意字符
Uncaught TypeError: Cannot read property '2' of undefined

2. (前面不加分号

试运行：

console.log('任意字符')
(1 + 2) === 3 ? 'xx' : 'oo'

得到：

任意字符
Uncaught TypeError: console.log(...) is not a function

3. +前面不加分号

console.log('任意字符')
+1

得到：

任意字符
NaN

4. -前面不加分号

console.log('任意字符')
-1

得到：

任意字符
NaN

5. /前面不加分号

console.log('任意字符')
/1/.test('1') ? 'xx' : 'oo'

得到：

Uncaught SyntaxError: Unexpected token .

什么鬼？每一句都是合法语句，写在一起就报错？！

如果试试给两句中间敲空行呢？还是报错！！

怎么回事？

解释

浏览器内置的JS编译器有分号推断能力，不加分号党也正是据此坚称无需加分号，但是，编译器又有一个规定，就是总是优先将换行符前后的符号流当作一条语句解析。所以在JS编译器眼里：

console.log('任意字符')
[1,2].forEach(v=>v)

相当于：

console.log('任意字符')[1,2].forEach(v=>v)

这时候，console.log('任意字符')被当做一个函数执行语句，打印任意字符，但返回undefined，接着把undefined当做有属性的值，求undefined的属性为2的值。为什么是2呢？因为1,2会计算得到2。undefined当然没有键名为2的值，所以会报错Uncaught TypeError: Cannot read property '2' of undefined。

其他几个例子也是这个道理。

括号场景下，会将前面的部分当做函数，前面当然不是函数。

加减号场景下，会让undefined去加减1，当然得到NaN。

上面的都是运行时错粗，而斜杠场景下，直接是语法错误。

现在你明白为什么不要做不加分号党了吧？

可能你还会说，这几种场景出现的概率很低，那我也没啥可说的了，“又不是不能用”总能终结讨论。

总结

总之，加分号除了“要记得敲分号”之外，没有任何副作用，而不加分号，阅读代码总是要费力，比如：

      api
.a({
          ...this.queryParams,
        })
        .b((response) => {
          this.list = response.data.list;
          this.total = response.data.total;
          this.loading = false;
        })
.c({
          ...this.queryParams,
        })
        .d((response) => {
          this.list = response.data.list;
          this.total = response.data.total;
          this.loading = false;
        });
      api
        .a({
          ...this.queryParams,
        })
.b((response) => {
          this.list = response.data.list;
          this.total = response.data.total;
          this.loading = false;
        })
.c({
          ...this.queryParams,
        })
        .d((response) => {
          this.list = response.data.list;
          this.total = response.data.total;
          this.loading = false;
        });

假设有这么一套代码，各种then链，各种以})结尾的语句，如果不加分号，你看的清这是几条语句么？

题外篇

当然了，现在前端开发都会上ESLint，虽然没有测试过，但我相信，即便你是不加分号党，它也会智能的在上述符号前面加上分号（我真的没有测试过，如果事实是ESLint做不到，呵呵，真是天不助你们了）。其实分号更多的意义还是维护容易，代码能跑通真的不是一切。