Is there a quick way to convert a JavaScript object to valid JSON in the text editor?

Question

I have a big old config object. Something like:

var object = {
  item1: 'value1',
  item2: 1000,
  item3: ['a', 'b', 'c'],
  item4: [1, 2, 3],
  item5: {
    foo: 'bar'
  }
};

... and so on. I want to rewrite it as valid JSON so it can travel through the intertubes, but I don't want to go through every line in my file manually adding double quotes all over the place. Of course, I don't mind manually wrapping the whole thing in brackets and changing the initial assignment to be the first property, but beyond that I was hoping there's some resource that will do the grunt work.

Anyway, please help me out if know of a TextMate command, regex trick, online converter, friendly robot, or anything else that will make this less tedious.

Solution 1

1. Launch Firefox/Chrome/Safari
2. Open Firebug/developer tools
3. Copy/paste your code into the console.

4. Then type console.log(JSON.stringify(object)) and voila!

   {"item1":"value1","item2":1000,"item3":["a","b","c"],
    "item4":[1,2,3],"item5":{"foo":"bar"}}
   

5. Copy/paste back into your text editor.

---

For more control over the formatting, I have a free online webpage:

http://phrogz.net/JS/NeatJSON

that lets you paste JSON or JS values in one box and see JSON at the bottom, with lots of knobs and sliders to adjust how it looks. For example, the JS value ["foo","bar",{dogs:42,piggies:0,cats:7},{jimmy:[1,2,3,4,5],jammy:3.14159265358979,hot:"pajammy"}] can be formatted like any of the following (and more):

[
    "foo",                            <- adjustable indentation
    "bar",
    {"dogs":42,"piggies":0,"cats":7}, <- small objects on one line!
    {
        "jimmy":[1,2,3,4,5],          <- small arrays on one line!
        "jammy":3.142,                <- decimal precision!
        "hot":"pajammy"
    }
]

[
  "foo",
  "bar",
  { "cats":7, "dogs":42, "piggies":0 }, <- spaces inside braces!
  {
    "hot":"pajammy",                    <- sort object keys!
    "jammy":3.14159265358979,
    "jimmy":[ 1, 2, 3, 4, 5 ]           <- spaces after commas!
  }
]

[ "foo",                           <- 'short' format puts first value
  "bar",                           <- on same line as opening bracket...
  { "dogs"    : 42,
    "piggies" : 0,                 
    "cats"    : 7 },               <- ...and close bracket with last value!
  { "jimmy" : [ 1, 2, 3, 4, 5 ],
    "jammy" : 3.14159265358979,    <- spaces around colons!
    "hot"   : "pajammy" } ]        <- align object values!

Solution 2

Why wouldn't you just....

...send the result of JSON.stringify(). You don't need to type in the JSON, you need to generate it at runtime if I am not mistaken, so...

var mything = { .... } ; 
var jsonRep = JSON.stringify(mything); 

See also, Serializing an object to JSON

Solution 3

You can use Google Chrome's console (or Firebug, probably):

> object
  Object
    item1: "value1"
    item2: 1000
    item3: Array[3]
    item4: Array[3]
    item5: Object
    __proto__: Object
> JSON.stringify(object);
"{"item1":"value1","item2":1000,"item3":["a","b","c"],"item4":[1,2,3],"item5":{"foo":"bar"}}"

If you want a bit of further documentation, check out Using native JSON on the MDC.

Solution 4

Another JS to JSON online conversion tool with syntax highlighting.

View more solutions

Comments

[faboulaws]

Thanks. I really appreciate your feedback since this site is mine.