Sort JSON response by key value

2020-04-21 08:02发布

问题:

Before you tag this as duplicate - I've gone through these answers:

Sort JSON by array key value

Sort a JSON array object using Javascript by value

And I've tried moving the code over to my data, and it doesn't work. I've tried pushing each object item into an array as well, but that doesn't work because there's still an object inside each item.

Here's a bit of the JSON response I get (screenshot from the browser console)

As you can see, each item has an index - what I need is to sort the response according to the index. How do I do this?

This response is from wikipedia - as an aside. Here's the full API call, if it helps.

EDIT: Posting a bit of the response code here:

 "pages": {
      "736": {
        "pageid": 736,
        "ns": 0,
        "title": "Albert Einstein",
        "index": 2,
        "contentmodel": "wikitext",
        "pagelanguage": "en",
        "pagelanguagehtmlcode": "en",
        "pagelanguagedir": "ltr",
        "touched": "2018-01-24T22:40:11Z",
        "lastrevid": 821432412,
        "length": 145560,
        "fullurl": "https://en.wikipedia.org/wiki/Albert_Einstein",
        "editurl": "https://en.wikipedia.org/w/index.php?title=Albert_Einstein&action=edit",
        "canonicalurl": "https://en.wikipedia.org/wiki/Albert_Einstein",
        "thumbnail": {
          "source": "https://upload.wikimedia.org/wikipedia/commons/thumb/3/3e/Einstein_1921_by_F_Schmutzer_-_restoration.jpg/38px-Einstein_1921_by_F_Schmutzer_-_restoration.jpg",
          "width": 38,
          "height": 50
        },
        "pageimage": "Einstein_1921_by_F_Schmutzer_-_restoration.jpg"
      },
      "983": {
        "pageid": 983,
        "ns": 0,
        "title": "Albert Camus",
        "index": 10,
        "contentmodel": "wikitext",
        "pagelanguage": "en",
        "pagelanguagehtmlcode": "en",
        "pagelanguagedir": "ltr",
        "touched": "2018-01-26T09:34:35Z",
        "lastrevid": 822358239,
        "length": 53639,
        "fullurl": "https://en.wikipedia.org/wiki/Albert_Camus",
        "editurl": "https://en.wikipedia.org/w/index.php?title=Albert_Camus&action=edit",
        "canonicalurl": "https://en.wikipedia.org/wiki/Albert_Camus",
        "thumbnail": {
          "source": "https://upload.wikimedia.org/wikipedia/commons/thumb/0/08/Albert_Camus%2C_gagnant_de_prix_Nobel%2C_portrait_en_buste%2C_pos%C3%A9_au_bureau%2C_faisant_face_%C3%A0_gauche%2C_cigarette_de_tabagisme.jpg/42px-Albert_Camus%2C_gagnant_de_prix_Nobel%2C_portrait_en_buste%2C_pos%C3%A9_au_bureau%2C_faisant_face_%C3%A0_gauche%2C_cigarette_de_tabagisme.jpg",
          "width": 42,
          "height": 50
        },
        "pageimage": "Albert_Camus,_gagnant_de_prix_Nobel,_portrait_en_buste,_posé_au_bureau,_faisant_face_à_gauche,_cigarette_de_tabagisme.jpg"
      },
      "46721": {
        "pageid": 46721,
        "ns": 0,
        "title": "Edward VII",
        "index": 9,
        "contentmodel": "wikitext",
        "pagelanguage": "en",
        "pagelanguagehtmlcode": "en",
        "pagelanguagedir": "ltr",
        "touched": "2018-01-26T02:00:27Z",
        "lastrevid": 821663314,
        "length": 81925,
        "fullurl": "https://en.wikipedia.org/wiki/Edward_VII",
        "editurl": "https://en.wikipedia.org/w/index.php?title=Edward_VII&action=edit",
        "canonicalurl": "https://en.wikipedia.org/wiki/Edward_VII",
        "thumbnail": {
          "source": "https://upload.wikimedia.org/wikipedia/commons/thumb/4/44/Edward_VII_in_coronation_robes.jpg/35px-Edward_VII_in_coronation_robes.jpg",
          "width": 35,
          "height": 50
        },
        "pageimage": "Edward_VII_in_coronation_robes.jpg"
      }

回答1:

This is my approach, just convert to an array and then get back the JSON Object.

UPDATE: What I did was create an array of every page then using the Array.prototype.sort() function for Arrays I compared the index for each page then using a for-loop I recreated the JSON object using the objects within the sorted Array.

var json = {
  "pages": {
    "983": {
      "pageid": 983,
      "ns": 0,
      "title": "Albert Camus",
      "index": 10,
      "contentmodel": "wikitext",
      "pagelanguage": "en",
      "pagelanguagehtmlcode": "en",
      "pagelanguagedir": "ltr",
      "touched": "2018-01-26T09:34:35Z",
      "lastrevid": 822358239,
      "length": 53639,
      "fullurl": "https://en.wikipedia.org/wiki/Albert_Camus",
      "editurl": "https://en.wikipedia.org/w/index.php?title=Albert_Camus&action=edit",
      "canonicalurl": "https://en.wikipedia.org/wiki/Albert_Camus",
      "thumbnail": {
        "source": "https://upload.wikimedia.org/wikipedia/commons/thumb/0/08/Albert_Camus%2C_gagnant_de_prix_Nobel%2C_portrait_en_buste%2C_pos%C3%A9_au_bureau%2C_faisant_face_%C3%A0_gauche%2C_cigarette_de_tabagisme.jpg/42px-Albert_Camus%2C_gagnant_de_prix_Nobel%2C_portrait_en_buste%2C_pos%C3%A9_au_bureau%2C_faisant_face_%C3%A0_gauche%2C_cigarette_de_tabagisme.jpg",
        "width": 42,
        "height": 50
      },
      "pageimage": "Albert_Camus,_gagnant_de_prix_Nobel,_portrait_en_buste,_posé_au_bureau,_faisant_face_à_gauche,_cigarette_de_tabagisme.jpg"
    },
    "736": {
      "pageid": 736,
      "ns": 0,
      "title": "Albert Einstein",
      "index": 2,
      "contentmodel": "wikitext",
      "pagelanguage": "en",
      "pagelanguagehtmlcode": "en",
      "pagelanguagedir": "ltr",
      "touched": "2018-01-24T22:40:11Z",
      "lastrevid": 821432412,
      "length": 145560,
      "fullurl": "https://en.wikipedia.org/wiki/Albert_Einstein",
      "editurl": "https://en.wikipedia.org/w/index.php?title=Albert_Einstein&action=edit",
      "canonicalurl": "https://en.wikipedia.org/wiki/Albert_Einstein",
      "thumbnail": {
        "source": "https://upload.wikimedia.org/wikipedia/commons/thumb/3/3e/Einstein_1921_by_F_Schmutzer_-_restoration.jpg/38px-Einstein_1921_by_F_Schmutzer_-_restoration.jpg",
        "width": 38,
        "height": 50
      },
      "pageimage": "Einstein_1921_by_F_Schmutzer_-_restoration.jpg"
    }
  }
};

var array = [];
for (key in json.pages) {
  array.push(json.pages[key]);
}

array.sort(function(a, b) {
  return a.index - b.index;
});

json = {
  "pages": {}
};

for (var i = 0; i < array.length; i++) {
  json.pages[array[i]['pageid']] = array[i];
}

console.log(json);

Hope it helps!



回答2:

Your response seems to be an object, which can't be sorted. You first want to convert it into an array

const res = //... your response
const array = Object.keys(res).map(key => res[key]);

Now you can use the Array.sort function to sort your items by their index:

array.sort((itemA, itemB) =>  itemA - itemB)

Be aware that the sort function directly mutates the array.

See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort