ExtJS has some really nice support out of the box for converting JSON data to model objects. However, it only supports array-based associations, and doesn't support maps/associative arrays. The AssociativeReader - included here, along with two demo models and sample data - provides a way to do that.

AssociativeReader.js

/**
 * A variant of the JSON reader. Instead of reading arrays, where each record in the array field
 * has an 'id' property, it reads objects - aka associative arrays. The key of the entry will be the
 * array.
 * 
 * So where the JSON reader would like data like this:
 * [ { id: '1', property: 'foo' }, { id: '2', property: 'bar' } ]
 * 
 * the associative reader likes data like this:
 * { '1': { property: 'foo' }, '2': { property: 'bar' } }
 */
Ext.define('Twasink.data.AssociativeReader', {
    extend: 'Ext.data.reader.Json',
    alias: 'reader.associative',
    
    readRecords: function(data) {
        // convert the associative array into a normal array.
        
        var idProperty = 'id'; // should be a config value?
        
        var arrayData = []
        
        Ext.Object.each(data, function(key, value) {
            var arrayEntry = {};
            Ext.Object.merge(arrayEntry, value);
            arrayEntry[idProperty] = key;
            arrayData.push(arrayEntry);
        });
        return this.callParent( [ arrayData ]);
    }
})

Bar.js

Ext.define('Twasink.model.Bar', {
  extend: 'Ext.data.Model',
  idProperty: 'id',
  fields: [ 'baz', 'bux']
})

example_data.json

[
  { "id": "foo_1", "baz": "baz_1", "bux": "bux_1", "bar": {
      "bar_1": { "baz": "bar_baz_1", "bux": "bar_bux_1" },
      "bar_2": { "baz": "bar_baz_2", "bux": "bar_bux_2" }
    }
  },
  { "id": "foo_2", "baz": "baz_2", "bux": "bux_2", "bar": {
      "bar_1": { "baz": "bar_baz_3", "bux": "bar_bux_3" },
      "bar_2": { "baz": "bar_baz_4", "bux": "bar_bux_4" }
    }
  }
]

Foo.js

Ext.define('Twasink.model.Foo', {
  extend: 'Ext.data.Model',
  requires: [ 'Twasink.data.AssociativeReader', 'Twasink.model.Bar' ],
  idProperty: 'id',
  fields: [ 'baz', 'bux'],
  hasMany: [ { model: 'Twasink.model.Bar', name: 'bars', associationKey: 'bar', reader: 'associative' }]
})