_.sortBy object key value for d3 chart

Question

I know you're not supposed to sort javascript objects but I need to for a d3 chart. I have an object with a key of FICO score ranges and value of the count of how many in that range

var counts = {680-700: 30, 620-640: 41, 640-660: 24, 660-680: 10}

I need to return a sorted object such that the lowest value keys come first.

var desired_obj = { 620-640: 41, 640-660: 24, 660-680: 10, 680-700: 30  }

I attempted to use _.sortBy but it only returns the values

 _.sortBy(counts, function(val, key) { return val })

Answer 1

As discussed in the comments, JavaScript objects explicity have no order in the keys. (Source: https://stackoverflow.com/a/5525820/1007263 )

If you need to ensure order, you must convert your object into an array. You can do that easily with underscore:

a = {a:1, b:3, c:2}
_.map(a, function(value, key) { return {key: key, value: value} })
// [{"key":"a","value":1},{"key":"b","value":3},{"key":"c","value":2}]

And you can use chain to sort after mapping:

_.chain(a).map(function(value, key) { return {key: key, value: value} }).sortBy('value').value()
//"[{"key":"a","value":1},{"key":"c","value":2},{"key":"b","value":3}]"