Trailing commas (sometimes called "final commas") can be useful when adding new elements, parameters, or properties to JavaScript code. If you want to add a new property, you can simply add a new line without modifying the previously last line if that line already uses a trailing comma. This makes version-control diffs cleaner and editing code might be less troublesome.
JavaScript has allowed trailing commas in array literals since the beginning, and later added them to object literals (ECMAScript 5) and most recently (ECMAScript 2017) to function parameters.
JSON , however, disallows trailing commas.
,
JavaScript ignores trailing commas in arrays:
var arr = [ 1, 2, 3, ]; arr; // [1, 2, 3] arr.length; // 3
If more than one trailing comma is used, an elision (or hole) is produced. An array with holes is called
sparse
(a
dense
array has no holes). When iterating arrays for example with
Array.prototype.forEach()
or
Array.prototype.map()
, array holes are skipped.
var arr = [1, 2, 3,,,]; arr.length; // 5
Starting with ECMAScript 5, trailing commas in object literals are legal as well:
var object = {
foo: "bar",
baz: "qwerty",
age: 42,
};
ECMAScript 2017 allows trailing commas in function parameter lists.
The following function definition pairs are legal and equivalent to each other. Trailing commas don't affect the
length
property of function declarations or their
arguments
对象。
function f(p) {}
function f(p,) {}
(p) => {};
(p,) => {};
The trailing comma also works with method definitions for classes or objects:
class C {
one(a,) {}
two(a, b,) {}
}
var obj = {
one(a,) {},
two(a, b,) {},
};
The following function invocation pairs are legal and equivalent to each other.
f(p); f(p,); Math.max(10, 20); Math.max(10, 20,);
Function parameter definitions or function invocations only containing a comma will throw a
SyntaxError
. Furthermore, when using a
rest parameters
, trailing commas are not allowed:
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 trailing comma is also allowed on the left-hand side when using 析构赋值 :
// array destructuring with trailing comma
[a, b,] = [1, 2];
// object destructuring with trailing comma
var o = {
p: 42,
q: true,
};
var {p, q,} = o;
Again, when using a rest element, a
SyntaxError
will be thrown:
var [a, ...b,] = [1, 2, 3]; // SyntaxError: rest element may not have a trailing comma
Trailing commas in objects were only introduced in ECMAScript 5. As JSON is based on JavaScript's syntax prior to ES5, trailing commas are not allowed in JSON .
Both lines will throw a
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
Omit the trailing commas to parse the JSON correctly:
JSON.parse('[1, 2, 3, 4 ]');
JSON.parse('{"foo" : 1 }');
| 规范 |
|---|
| ECMAScript (ECMA-262) |
| Desktop | Mobile | Server | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Trailing commas | Chrome 1 | Edge 12 | Firefox 1 | IE 9 | Opera 9.5 | Safari 1 | WebView Android 1 | Chrome Android 18 | Firefox Android 4 | Opera Android 10.1 | Safari iOS 1 | Samsung Internet Android 1.0 | nodejs 0.1.100 |
| Trailing comma in functions | Chrome 58 | Edge 14 | Firefox 52 | IE No | Opera No | Safari 10 | WebView Android No | Chrome Android 58 | Firefox Android 52 | Opera Android No | Safari iOS 10 | Samsung Internet Android 7.0 | nodejs 8.0.0 |
| Trailing comma in object literals | Chrome 1 | Edge 12 | Firefox 1 | IE 9 | Opera 9.5 | Safari 3 | WebView Android 1 | Chrome Android 18 | Firefox Android 4 | Opera Android 10.1 | Safari iOS 1 | Samsung Internet Android 1.0 | nodejs 0.1.100 |
完整支持
不支持