Why HttpClient Angular order json field

Question

I just discovered a small problem coming from HttpClient, when I try to fetch data from my api:

constructor(private http: HttpClient) {}
ngOnInit(): void {
    this.http.get("http://localhost:8080/api/test/test?status=None").subscribe((data)=>{
    console.log(data);
})}

It seems to order the json field in alphabetic order. Here is the result from Postman:

"total": {
    "error": 321,
    "run": 338,
    "desc": 1000
}

And here is from Angular HttpClient:

total: {
    desc: 321,
    error: 1000,
    run: 338
}

Did someone have the same issue or just a tip to force HttpClient to not alphabetically order the field?

In your example the response is ordered in Postman but NOT ordered in HttpClient. Did I miss something? — Christoph Lütjen
– Christoph Lütjen, Commented Feb 19, 2024 at 17:15
Yeah sorry, it just fake the field. I correct it to match it to my question — Forcela8
– Forcela8, Commented Feb 19, 2024 at 17:24
Neither result is in order. Also the result from Angular in your question is not in JSON format. Please proofread before posting — Benny Halperin
– Benny Halperin, Commented Feb 19, 2024 at 17:26
this is how browser represents objects passed from json. you should not rely on the order of properties in javacsript objects. ordered collections are for example arrays. on other js engines order of props can theoretically be different, but afaik all popular browsers would make properties go in order — Andrei
– Andrei, Commented Feb 19, 2024 at 18:13
Do NOT rely on the order of an object. Use arrays/iterables instead. — Matthieu Riegler
– Matthieu Riegler, Commented Feb 19, 2024 at 20:50

Aviv · Accepted Answer · 2024-02-24 18:25:50Z

1

The order of a JSON object is insignificant.

According to json.org:

"An object is an unordered set of name/value pairs"

If you have to depend on the order of an object, then you might want to use an iterable data type like array that can be used in JSON.

edited Feb 24, 2024 at 18:25

answered Feb 24, 2024 at 18:25

Aviv

363 bronze badges

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

Collectives™ on Stack Overflow

Why HttpClient Angular order json field

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related