[Javascript] JSON.parse API

JSON

(JavaScript Object Notation) is a standard method to serialize JavaScript objects and is commonly used to transfer data from the server to the browser. The browser has a

JSON

API that allows you to parse the

JSON

string into a JavaScript object. This API allows you to customize the parsing behavior very specifically as well.

If you get a string which represent an json object, you can use JSON.parse to parse the string:

var input = '[{"id":1,"title":"Gone with the Wind","publishDate":"1936-06-10T00:00:00.000Z","related":[80,3]},{"id":2,"title":"Freelancer","publishDate":"2015-08-11T00:00:00.000Z","related":[45,89]},{"id":3,"title":"A Christmas Carol","publishDate":"1843-12-19T00:00:00.000Z","related":[20,33]},{"id":4,"title":"The Cat in the Hat","publishDate":"1957-03-12T00:00:00.000Z","related":[50,10]}]'
var res = JSON.parse(input);
console.log(res);

/*
[[object Object] {
id: 1,
publishDate: "1936-06-10T00:00:00.000Z",
related: [80, 3],
title: "Gone with the Wind"
}, [object Object] {
id: 2,
publishDate: "2015-08-11T00:00:00.000Z",
related: [45, 89],
title: "Freelancer"
}, [object Object] {
id: 3,
publishDate: "1843-12-19T00:00:00.000Z",
related: [20, 33],
title: "A Christmas Carol"
}, [object Object] {
id: 4,
publishDate: "1957-03-12T00:00:00.000Z",
related: [50, 10],
title: "The Cat in the Hat"
}]
*/

JSON.parse(input, reviver), function can take a second object which is a reviver function:

for example, you can to parse this string:

var input = '[{"id":1,"title":"Gone with the Wind","publishDate":"1936-06-10T00:00:00.000Z","related":[80,3]},{"id":2,"title":"Freelancer","publishDate":"2015-08-11T00:00:00.000Z","related":[45,89]},{"id":3,"title":"A Christmas Carol","publishDate":"1843-12-19T00:00:00.000Z","related":[20,33]},{"id":4,"title":"The Cat in the Hat","publishDate":"1957-03-12T00:00:00.000Z","related":[50,10]}]'

to:

var expected = [
{id: 1, title: 'Gone with the Wind', publishDate: new Date('1936-06-10'), related: [80, 3]},
{id: 2, title: 'Freelancer', publishDate: new Date('2015-08-11'), related: [45, 89]},
{id: 3, title: 'A Christmas Carol', publishDate: new Date('1843-12-19'), related: [20, 33]},
{id: 4, title: 'The Cat in the Hat', publishDate: new Date('1957-03-12'), related: [50, 10]},
]

The difference is 'publishDate' is a Date object instead of string.

So what we can do is:

var input = '[{"id":1,"title":"Gone with the Wind","publishDate":"1936-06-10T00:00:00.000Z","related":[80,3]},{"id":2,"title":"Freelancer","publishDate":"2015-08-11T00:00:00.000Z","related":[45,89]},{"id":3,"title":"A Christmas Carol","publishDate":"1843-12-19T00:00:00.000Z","related":[20,33]},{"id":4,"title":"The Cat in the Hat","publishDate":"1957-03-12T00:00:00.000Z","related":[50,10]}]';

var expected = [
{id: 1, title: 'Gone with the Wind', publishDate: new Date('1936-06-10'), related: [80, 3]},
{id: 2, title: 'Freelancer', publishDate: new Date('2015-08-11'), related: [45, 89]},
{id: 3, title: 'A Christmas Carol', publishDate: new Date('1843-12-19'), related: [20, 33]},
{id: 4, title: 'The Cat in the Hat', publishDate: new Date('1957-03-12'), related: [50, 10]},
];

var result = JSON.parse(input, reviver);

expect(result).toEqual(expected);
console.log("Test pass");

// function declarations
function reviver(key, value) {
if (key === '') { // handle root level object, the last key is ""
return value; // normal just need to return value, what you return here will be used as parsed value
}

// handle the case you want to take care
if (key === 'publishDate') {
return new Date(value)
}
return value
}