Ordering JSON with Javascript

Question

Considering I have the following JSON, how could I generate another JSON, ordering by a field (let's say anoCobranca)?

{
  "extratos": [
    {
      "descricao":         "product A",
      "anoCobranca":       2012,
      "mesCobranca":       01,
      "nomeMesCobranca":   "Janeiro",
      "diaUsoInicial":     1,
      "diaUsoFinal":       30,
      "valor":             "236.81",
      "vencimento":        "24/01/2012",
      "formaPagamento":    "Cartão",
      "situacao": "ok"
    },
    {
      "descricao":         "product B",
      "anoCobranca":       2012,
      "mesCobranca":       2,
      "nomeMesCobranca":   "Fevereiro",
      "diaUsoInicial":     1,
      "diaUsoFinal":       29,
      "valor":             "249.81",
      "vencimento":        "24/02/2012",
      "formaPagamento":    "-",
      "situacao":          "aberto"
    },
    {
      "descricao":         "product 1",
      "anoCobranca":       2012,
      "mesCobranca":       3,
      "nomeMesCobranca":   "Março",
      "diaUsoInicial":     1,
      "diaUsoFinal":       31,
      "valor":             "339.11",
      "vencimento":        "24/03/2012",
      "formaPagamento":    "Cartão",
      "situacao":          "ok"
    },
    {
      "descricao":         "product D",
      "anoCobranca":       2011,
      "mesCobranca":       4,
      "nomeMesCobranca":   "Abril",
      "diaUsoInicial":     1,
      "diaUsoFinal":       30,
      "valor":             "119.18",
      "vencimento":        "24/04/2012",
      "formaPagamento":    "Cartão",
      "situacao":          "ok"
    },
    {
      "descricao":         "product E",
      "anoCobranca":       2011,
      "mesCobranca":       5,
      "nomeMesCobranca":   "Maio",
      "diaUsoInicial":     1,
      "diaUsoFinal":       30,
      "valor":             "81.29",
      "vencimento":        "24/05/2012",
      "formaPagamento":    "-",
      "situacao":          "aberto"
    }
  ]
}

I've tried a few techniques like:

function sortJSON(a,b){
  return parseInt(a.json.extratos.anoCobranca - b.json.extratos.anoCobranca)
}

And a few others I found here, at StackOverflow, but all of them failed.

Answer 1

Sort the array with a callback function :

obj.extratos.sort(function(a, b) {
  return a.anoCobranca - b.anoCobranca;
});

Answer 2

If you're not averse to using an external library then I would recommend using Underscore.js to solve this and similar problems. Here's an example of me doing it in one line below:

var model = {
  "extratos": [
    {
      "descricao":         "product A",
      "anoCobranca":       2012,

            .
            .
            .

      "situacao":          "aberto"
    }
  ]
};

model.extratos = _.sortBy(model.extratos, 
                   function (extrato) { return extrato.anoCobranca; });

console.log(model);

and here's a jsFiddle where you can play with that: http://jsfiddle.net/JohnMunsch/4eE2F/

Yanick's solution is a good one as well but I think that the Underscore library has a wide range of functions (for example, map and reduce) which can help you solve a complex set of data manipulation problems that transcend just simple sorting.

Answer 3

With underscore you can just do:

_(obj.extratos).pluck(propertyName).sort()