合法的尾逗号

尾逗号（即终止逗号）在向 JavaScript 代码添加元素、参数、属性时十分有用。

如果想添加新的属性，并且上一行已经使用了尾逗号，可以仅仅添加新的一行，而不需要修改上一行。

一、数组的尾逗号

JS 数组字面量的尾逗号会被忽略：

var arr = [
  1,
  2,
  3,
];
arr;        // [1, 2, 3]
arr.length; // 3

var arr = [1, 2, 3, , ,];
arr.length;   // 5

为什么数组的尾逗号会被省略？有两个好处：

• 重新排列元素项比较简单，如果要改变最后一个元素项的位置，不必添加和删除逗号。
• 帮助版本控制系统跟踪实际发生的变化。

例如：

[
  'foo'
]

修改为：

[
  'foo',
  'bar'
]

这么做，版本控制系统会标记 foo 行和 bar 行为已更改，尽管唯一真正的变化是添加了后面的一行。

二、对象的尾逗号

从 ECMAScript 5 开始，对象字面值中的尾逗号也符合语法：

var obj = {
  foo: "bar",
  baz: "qwerty",
  age: 42,
};

三、函数中的尾逗号

ES 8（ECMAScript 2017）支持函数参数中的尾逗号。

1、函数参数定义

下面的两个函数定义都是合法的，并且互相等价。

function f(p) { }
function f(p,) { }

(p) => { };
(p,) => { };

尾逗号并不影响函数定义，或者其 arguments 对象的 length 属性。

尾逗号也可用于类或对象的方法定义：

class C {
  one(a,) { },
  two(a, b,) { },
}

var obj = {
  one(a,) { },
  two(a, b,) { },
};

2、函数调用

下面的两个函数调用都是合法的，并且互相等价。

f(p);
f(p,);

Math.max(10, 20);
Math.max(10, 20,);

3、函数不合法的尾逗号

仅仅包含逗号的函数参数定义或者函数调用会抛出 SyntaxError。

而且，当使用剩余参数时，并不支持尾逗号。

举个例子：

function f(,) { }     // SyntaxError: missing formal parameter
(,) => { };           // SyntaxError: expected expression, got ','
f(,)                  // SyntaxError: expected expression, got ','
function f(...p,) { } // SyntaxError: parameter after rest parameter
(...p,) => { }        // SyntaxError: expected closing parenthesis, got ','   

四、解构中的尾逗号

在使用解构赋值时，尾逗号也可以用于左侧：

// 带有尾后逗号的数组解构
[a, b,] = [1, 2];

// 带有尾后逗号的对象解构
var o = {
  p: 42,
  q: true,
};
var { p, q, } = o;

同样地，在使用剩余参数时，会抛出 SyntaxError：

var [a, ...b,] = [1, 2, 3];
// SyntaxError: rest element may not have a trailing comma

五、JSON 中的尾逗号

JSON 中不允许尾逗号。

下面两行都会抛出 SyntaxError：

JSON.parse('[1, 2, 3, 4, ]');
JSON.parse('{"foo" : 1, }');
// SyntaxError JSON.parse: unexpected character
// at line 1 column 14 of the JSON data

去掉尾逗号就行了：

JSON.parse('[1, 2, 3, 4 ]');
JSON.parse('{"foo" : 1 }');