Weird JSON parsing behavior in js, "Unexpected token :"

Question

As demonstrated in this jsfiddle, if you have a JS file and you create a JSON object without using it, it behaves differently depending on whether the keys(members) are wrapped in quotes or not.

valid code:{ a: 1};
invalid code: { "a": 1 };

What you will get is an error message (in Chrome, different for FF/IE, but still fails on syntax)

Uncaught SyntaxError: Unexpected token :

but if you use the object in some way, for example: alert({ "a": 1 }); everything is OK again.

Why does this happen?

Pointy · Accepted Answer · 2012-04-09 22:20:38Z

71

The statement:

{ a: 1 };

is not an object literal. It's a block statement with one labeled expression in it. It's valid.

This:

{ "a": 1 };

is a syntax error because it's just not parseable. The quoted "a" starts an expression statement inside the block, but then the next token after the string is a colon, and there's no expression form that looks like an expression followed by a colon.

Now:

var x = { "a": 1 };

works because the "{" is not interpreted as the start of a block statement. That statement starts with var, so it's a variable declaration. Within the expression on the right side of the "=" token, the only thing that a "{" can mean is the start of an object literal. Similarly, note that:

({ "a": 1 });

is OK because the opening parenthesis makes the parser expect a nested subexpression, so again the "{" unambiguously means that it's the start of an object literal.

edited Apr 9, 2012 at 22:20

answered Apr 9, 2012 at 22:15

Pointy

415k62 gold badges600 silver badges631 bronze badges

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

6 Comments

karnyj Over a year ago

but assigning it to a var makes it an object literal?

Pointy Over a year ago

Yes, because there is no ambiguity.

karnyj Over a year ago

i think it's the labeled statement i didn't see coming. never even saw JS code with use of labels, though i vaguely remembered it's supported

Pointy Over a year ago

Yes it's a pretty rarely-used feature of the language. Possibly it's most commonly used by accident when people put "javascript:" at the beginning of "onfoo" attribute values :-)

Krummelz Over a year ago

Pointy, what are you to do, when your serializer, serializes your data into the incorrect format of { "a": 1 }?

|

SCBuergel · Accepted Answer · 2016-07-30 22:18:35Z

3

I just realized than when loading the JSON via require and the filename does not end on .json i get this error. Renaming the file to bla.json and it works fine.

answered Jul 30, 2016 at 22:18

SCBuergel

1,65317 silver badges26 bronze badges

Comments

Chris Klingler · Accepted Answer · 2015-10-09 00:21:31Z

2

This error can popup when doing a jQuery AJAX call using jsonp when jsonp is not necessary. Try switching your data type on your AJAX call if this is the case to normal json

$.ajax({
     dataType: 'json', // try using json rather than json p
     ...
});

answered Oct 9, 2015 at 0:21

Chris Klingler

5,3042 gold badges39 silver badges43 bronze badges

Collectives™ on Stack Overflow

Weird JSON parsing behavior in js, "Unexpected token :"

3 Answers 3

6 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related