Dictionary is ordered in python but not in js

Question

I've a website in reactjs and with a backend written in python. Now, I've a list of photos and I want sort this by a key called "score".

In python I do this (pls, tell me if it's safe to do queries in this way, I'm using MySQLdb with Flask):

sql = "SELECT id, image_url, score, width, height FROM images ORDER BY score DESC LIMIT 10 OFFSET %s"
        conn.cursor.execute(sql, (offset,))
        images = conn.cursor.fetchall()
        dictImages = {}
        for image in images:
            dictImages[image[0]] = {"url": image[1], "score": image[2], "width": image[3], "height": image[4]}

and my dictImages is:

98: {'url': '62eb97f4496e9bd19755426bde78528f760f1e231545594871.jpg', 'score': 1459, 'width': 720, 'height': 1080}, 
100: {'url': '5a3a28f6f174d5995e6b6d6882e7c055c324f0081545595509.jpg', 'score': 1400, 'width': 1080, 'height': 1080}, 
97: {'url': '2516629bb990e9e8e6a4ccdaeae4048aa83119ee1545550157.JPG', 'score': 1390, 'width': 720, 'height': 899}, 
96: {'url': '6d3236ec3c88039ca534b81acad564e847ecb0621545549723.jpg', 'score': 1381, 'width': 640, 'height': 640}, 
99: {'url': '7a09101b84cd5618bfcdfa8423c16232788bf9691545595051.png', 'score': 1370, 'width': 1080, 'height': 940}

As you can see it is ordered by score, but the js object isn't, it is:

  "96": {
    "height": 640, 
    "score": 1381, 
    "url": "6d3236ec3c88039ca534b81acad564e847ecb0621545549723.jpg", 
    "width": 640
  }, 
  "97": {
    "height": 899, 
    "score": 1390, 
    "url": "2516629bb990e9e8e6a4ccdaeae4048aa83119ee1545550157.JPG", 
    "width": 720
  }, 
  "98": {
    "height": 1080, 
    "score": 1459, 
    "url": "62eb97f4496e9bd19755426bde78528f760f1e231545594871.jpg", 
    "width": 720
  }, 
  "99": {
    "height": 940, 
    "score": 1370, 
    "url": "7a09101b84cd5618bfcdfa8423c16232788bf9691545595051.png", 
    "width": 1080
  }, 
  "100": {
    "height": 1080, 
    "score": 1400, 
    "url": "5a3a28f6f174d5995e6b6d6882e7c055c324f0081545595509.jpg", 
    "width": 1080
  }

It's ordered by key. How can I avoid this problem? And how can I order it efficiently? (Now I've only few keys, but suppose to have much more..)

Thank you for any advise!

Use a `Map` object, which keeps its elements in order: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map — Al.G., Dec 23 '18 at 11:26
I'm using it, I do this: `const photos = Object.keys(arr).map((i) => ( HTMLCODE );` the var arr is the dictImages — Stackedo, Dec 23 '18 at 11:26
What is the type of `arr`? I presume it's a regular object as you get the elements unordered. — Al.G., Dec 23 '18 at 11:29
@Stackedo, no, you're using the `map` method of the `Object` object wrapper. You need to use the `Map` object. — Ro Achterberg, Dec 23 '18 at 11:29
Neither Python dictionaries nor JSON/JS objects are ordered data structures. If order matters, use a list/array. — jonrsharpe, Dec 23 '18 at 11:30
@Stackedo, please also refer to this answer: https://stackoverflow.com/questions/5525795/does-javascript-guarantee-object-property-order — Ro Achterberg, Dec 23 '18 at 11:30
Mh, I did this: `const map = new Map(); Object.keys(arr).forEach(key => { map.set(key, arr[key]); });` or am I doing wrong? Now it's like my arr, but it is a Map object (obviously it isn't yet ordered) — Stackedo, Dec 23 '18 at 11:42
@Stackedo No, you need to create your *`arr`* as a Map object, as I pointed in my answer. — Al.G., Dec 23 '18 at 11:43

score 0 · Answer 1 · answered Dec 23 '18 at 11:42

0

When creating arr, you're using a regular Object ({}), which does not preserve the elements in the order they're insterted. Instead, you can use a Map object which does it:

var arr = new Map();

for(var i=0; ....)
    arr.set(i, VALUE);

answered Dec 23 '18 at 11:42

Al.G.

3,929
6
32
52

Dictionary is ordered in python but not in js

1 Answers1