JSON parser adds double quotes to object key in javascript

Question

I have encountered a weird problem. I am consuming a RESTful API which returns the following response body:

{
"bourseMarket":[2.9966187229626504E16,2.8923052836886444E16],
"bourseTrade":[1.13589172355139E14,4.903299930043E13],
"‌bourseMarketf":[6.037694517655877E15,5.876172638826381E15],
"‌bourseTradef":[4.3646660180697E13,2.2708648590401E13]
}

When I parse this, JS returns the following object:

bourseMarket: Array [ 29966187229626504, 28923052836886444 ]
bourseTrade: Array [ 113589172355139, 49032999300430 ]
"‌bourseMarketf": Array [ 6037694517655877, 5876172638826381 ]
"‌bourseTradef": Array [ 43646660180697, 22708648590401 ]

As you may see, JS adds double quotes to third and fourth object keys. And after that I can not refer to the object key and value:

TypeError: obj.bourseTradef is undefined

I even tried obj["bourseTradef"] but was unsuccessful too.

I use standard methods to retrieve data:

const getData = async (url) => {

    return await fetch(url).then(resp => {
        if (resp.status === 200) {

            return resp.json();
        }
        else
            throw new Error("HTTP ERROR");
    }
    ).catch(e => { showAlert("مشکل در شبکه") });
}

getData(tradeBaseUrl).then((obj) => {
        console.log(obj);
....

UPDATE

I made a stupid mistake. I have added an invisible character at the beginning of those two keys mistakenly. I found out the problem by inspecting the request body Network section, as Phil suggested. Two little pink circles were added at the beginning of key strings.

Take a look in your browser's Network console. What exactly is the raw, unparsed response body for this request? — Phil
– Phil, Commented Apr 27, 2020 at 4:13
FYI, you can use resp.ok instead of resp.status === 200 as a more reliable way to detect a successful response — Phil
– Phil, Commented Apr 27, 2020 at 4:14
If you're stuck with this bizarre data format, you want obj['"bourseTradef"'] — Phil
– Phil, Commented Apr 27, 2020 at 4:17
@Phil Thanks a lot Phil! I mistakenly have added invisible non-english character at the beginning of those two strings! I deleted them and everything is OK. — Iman H
– Iman H, Commented Apr 27, 2020 at 4:20

KooiInc · Accepted Answer · 2020-04-27 04:25:06Z

3

Both keys contain a hidden character. If you open (edit) the snippet it shows, but you can also use charCodeAt to reveal it:

const x = JSON.parse(`{
  "bourseMarket":[2.9966187229626504E16,2.8923052836886444E16],
  "bourseTrade":[1.13589172355139E14,4.903299930043E13],
  "‌bourseMarketf":[6.037694517655877E15,5.876172638826381E15],
  "‌bourseTradef":[4.3646660180697E13,2.2708648590401E13]
}`);

console.log(`you would expect "bourseTradef".charCodeAt(0) to be  be ${"bourseTradef".charCodeAt(0)}`);
console.log(`but here it is ${"‌bourseTradef".charCodeAt(0)}`);

console.log(`So x["‌bourseTradef"] is possible: ${x["‌bourseTradef"]}`);
console.log(`But not x["bourseTradef"]: ${x["bourseTradef"]}`);

.as-console-wrapper { top: 0; max-height: 100% !important; }

answered Apr 27, 2020 at 4:25

KooiInc

124k32 gold badges145 silver badges181 bronze badges

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

Comments

seanpue · Accepted Answer · 2020-04-27 04:26:21Z

1

There is a zero width non-joiner (\u200c) character at the start of "‌bourseMarketf" and "‌bourseTradef" in the sample. Javascript adds the quotation marks to indicate its presence.

answered Apr 27, 2020 at 4:26

seanpue

3431 silver badge7 bronze badges

Collectives™ on Stack Overflow

JSON parser adds double quotes to object key in javascript

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related