224

Are trailing commas standard in JavaScript, or do most browsers like Chrome and Firefox just tolerate them?

I thought they were standard, but IE8 puked after encountering one—of course IE not supporting something hardly means it’s not standard.

Here’s an example of what I mean (after the last element of the books array):

var viewModel = {
    books: ko.observableArray([
        { title: "..", display: function() { return ".."; } },
        { title: "..", display: function() { return ".."; } },
        { title: "..", display: function() { return ".."; } }, // <--right there
    ]),
    currentTemplate: ko.observable("bookTemplate1"),
    displayTemplate: function() { return viewModel.currentTemplate(); }
};
Improve this question
4
  • Found this the other day. Being a C# programmer I was so used to them being allowed... Commented Aug 30, 2011 at 16:35
  • 5
    I dealt with this a few weeks ago. Imagine trying to find this in IE7 without any of the newer debugging tools... Commented Aug 30, 2011 at 16:37
  • 4
    It made me happy when I discovered languages like JS, Ruby, C# support this—makes copy pasting test data easy...it made me angry when I realized IE sucks in even this... Commented Aug 30, 2011 at 16:40
  • I wonder if significant whitespace instead of commas (kind of like CoffeeScript) would cause any syntactic ambiguity? Commented Sep 1, 2015 at 18:45

6 Answers 6

Reset to default
218

Specs: ECMAScript 5 and ECMAScript 3

Section 11.1.5 in the ECMAScript 5 specification: 

ObjectLiteral :
    { }
    { PropertyNameAndValueList }
    { PropertyNameAndValueList , }

So yes, it is part of the specification.

Update: Apparently this is new in ES5. In ES3 (page 41), the definition was just:

ObjectLiteral :
    { }
    { PropertyNameAndValueList }

For arrays literals (Section 11.1.4) it is even more interesting (Update: this already existed in ES3):

ArrayLiteral :
    [ Elisionopt ]
    [ ElementList ]
    [ ElementList , Elision_opt ]

(where Elision_opt is Elisionopt, meaning the Elision is optional)

Elision is defined as 

Elision :
    ,
    Elision ,

So, an array literal like 

var arr = [1,2,,,,];

is perfectly legal. This creates an array with two elements but sets the array length to 2 + 3 = 5.

Don't expect too much from IE (before IE9)...

Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

As I asked EndoPhage, do you happen to know whether this was standard in ES3 as well? I can't seem to find the spec for it
It's here: ecma-international.org/publications/files/ECMA-ST-ARCH/…
Apparently, the trailing comma in object literals was not in the ES3 spec. But the definition for arrays is the same.
Well it was array elements that I ran into this with, so I guess there's no excuse for MS no matter how you cut it. Thanks again
IIRC IE 8 will parse the array but place a null value in the array rather than ignoring it. IE7 and below would fail to parse.
96

Just a quick reminder/warning that this is one of the areas in which the JavaScript/ECMAScript standard and JSON standard differ; trailing commas are valid in JS but not valid in JSON.

Improve this answer

1 Comment

But then again, if superset is in for a "Change Of Heart" , "Could you (still) be loved" if you just for once adjusted?
54

What is even funnier, IE7 gives

[1,].length  --> 2

while Firefox and Chrome

[1,].length  --> 1
Improve this answer

5 Comments

But [1,,].length gives 2. Sense: browsers make none.
Makes perfect sense, the spec says that a (note: singular) trailing comma does not add to the length of an array. Chrome and Firefox have implemented ES5 correctly.
When there are 2 (plural) trailing commas, only one adds to the length of the array, so it seems more accurate to say that the final trailing comma is ignored than to say a single trailing comma is ignored.
@JaredMcAteer There is an exception to the trailing comma rule: [,].length gives 1.
@ElijasDapšauskas that's not really an exception. The singular trailing comma doesn't add anything to the length but for it to exist there needs to be something to the left of it so [,] is equivalent to [undefined,] and [undefined].length === 1. Perhaps the wording of my comment leaves this case ambiguous but the specification does not.
4

You can find the specification for javascript (aka ECMA Script) here. You can find the relevant definition for arrays on page 63 and as Felix noted, the object definition a couple of pages later on page 65.

While this specification says it is fine to have a trailing , I don't know if that would be true looking back a few versions. As you've noted IE8- will crap itself if you leave a trailing comma but Chrome and FF handle it fine.

Improve this answer

3 Comments

Off the top of your head, was this part of the ES3 standard? I can't seem to find the ES3 spec
@Adam I've been trying to find it... Given the release dates (ES3 was published in 1999, ES4 was abandoned and ES5 was only published in 2009), it would make sense that it was in the ES3 standard. Or it could just be that MS screwed up one more thing.
Looks like MS screwed up one more thing given Felix's answer. Thanks again for yours
4

Let's break this down.

Are trailing commas standard in JavaScript?

Yes. As of the ECMAScript 5 specification (also part of the Google and Airbnb style guide)

Do most browsers like Chrome and Firefox just tolerate them?

This is an ECMAScript 5 support question.

Transpilers like Babel will remove the additional trailing comma in the transpiled code which means you don’t have to worry about the trailing comma problem in legacy browsers.

So that means:

var heroes = [
  'Batman',
  'Superman',
];
// heroes.length === 2 (not 3)

So chances are if you're using anything ES5 and up you don't need to worry about it.

I thought they were standard, but IE8 puked after encountering one—of course IE not supporting something hardly means it’s not standard.

Again, that's an ECMAScript 5 support question. IE8 doesn't support ECMAScript 5 (only IE9 and up)

I would highly recommend taking a look Airbnb's ES5 deprecated Documentation https://github.com/airbnb/javascript/blob/es5-deprecated/es5/README.md#commas

I would also recommend the Mozilla's Docs:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Trailing_commas

Improve this answer

Comments

1

On Chrome 52 :

[1,].length --> 1
[1,2,].length --> 2
[].length --> 0 
[,].length --> 1    <<<<=== OUHHHHH !!!!

I just don't like trailing commas. People usually use them in Open Source projects for avoiding to erase the line written by another commiter. See the same question in Python : https://stackoverflow.com/a/11597911/968988

Improve this answer

2 Comments

Why 'OUHHHHH'? What else did you expect there if not 1? You clearly 'have an element' before that comma, just like [1,] (which is length: 1).
Why 'OUHHHHH'? because I don't expect anything from a code that I don't understand without reading the RFC. And yes, it works just like [1,] : there is clearly something before the comma. But in [,] there is as much before and after the comma. So because I don't understand [,] alone, I dont think using [1,] is good idea.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.