Unable to get value after JSON parsing

Question

I am facing issue while converting the value from below string. Tried to parse JSON but didn't work.

const val1 = "{a: '123'}";

console.log(typeof(val1)); // string

const a = JSON.parse(val1); // Gives Error: Unexpected token a in JSON at position 1

const b = JSON.parse(JSON.stringify(val1)); 
console.log(b); // {a: '123'}
console.log(b.a); // ---> undefined

console.log(typeof(b)); // string -> How?

Again if I do, JSON.parse(b) -> Gives error: Unexpected token a in JSON at position.

Can someone suggest what I am doing wrong

Try this : `const val1 = "{'a': '123'}";`. `a` should be enclosed in single quotes. — LearningEveryday, Apr 10 '20 at 05:51
Apart from the quotes, the type of quotes matter as well. val1 should be enclosed in single quotes and the json key values in double quotes. So try this: `const val1 = '{"a": "123"}';` — LearningEveryday, Apr 10 '20 at 05:57
@LearningEveryday const val1 = '{"a": "123"}'; works. but, I am receiving string in that pattern from server. — iReact, Apr 10 '20 at 06:02

score 2 · Accepted Answer · answered Apr 10 '20 at 06:00

Try the following

const jsonString = '{"a": "123"}';
const parsedJson = JSON.parse(jsonString);

console.log(parsedJson.a)

the problem is the single quote in your json string, see this https://www.json.org/json-en.html

You can use the following

const jsonString1 = '{"a": "123"}';
const jsonString2 = "{\"a\": \"123\"}";

palaѕн · Answer 2 · 2020-04-10T06:10:52.433

const val1 = "{a: '123'}";
console.log(typeof(val1)); // string
const a = JSON.parse(val1); // Gives Error:

This happens because val1 here is not a valid json string, as property a and its value inside the object is not wrapped in double quotes. After doing that you can see it works fine:

const val1 = '{"a": "123"}';
console.log(typeof(val1)); // string
const a = JSON.parse(val1); // It works!
console.log( a )

const b = JSON.parse(JSON.stringify(val1)); 
console.log(b); // {a: '123'}
console.log(b.a); // ---> undefined

b.a is undefined here because b is not actually an object here but string:

const val1 = "{a: '123'}";
const b = JSON.parse(JSON.stringify(val1));
console.log(b); // {a: '123'}
console.log(typeof b); // string
console.log(b.a); // ---> undefined

This happens because

JSON.stringify(val1)

converts "{a: '123'}" to ""{a: '123'}"". It simply add double quotes around val1 as it was already a string.

and using JSON.parse on it just removed the double quotes from it and we got back string again.

const val1 = "{a: '123'}";
const val2 = JSON.stringify(val1);
console.log( val2 )   // "{a: '123'}" ... its actually ""{a: '123'}""
console.log( typeof val2 )  // string

const val3 = JSON.parse(val2);
console.log( val3 )   // {a: '123'} ... its actually "{a: '123'}"
console.log( typeof val3 )  // string

score 0 · Answer 3 · answered Apr 10 '20 at 06:06

I think the problem is in your line #4

const b = JSON.parse(JSON.stringify(val1));

You are trying to parse the result of

JSON.stringify("{a: '123'}")

That produces a "string inside string".

As previous answer suggested, make sure your json format is correct. Use tool like https://jsonlint.com/ to check your json.

score 0 · Answer 4 · answered Apr 10 '20 at 06:09

Changed the code below. Please check as it works.

    const val1 = '{"a": "123"}';

console.log(typeof(val1)); // string

const a = JSON.parse(val1); // a is a json now

const b = JSON.parse(JSON.stringify(val1)); //val1 is already is string so no need to do this
console.log(a); // {a: '123'}
console.log(a.a); // ---> changed to a
const c = JSON.parse(b);
console.log(typeof(b)); // string -> Double stringing but converting to json only once so its still a string
console.log(typeof(c)); // Have to do JSON.parse on b to make it a Object again

Unable to get value after JSON parsing

4 Answers4