How to get unique/Distinct data from store?

Question

i am using the extjs. i need to retrieve distinct data from store as per requirement. In my store contains single list not nested list in that have regions like AMERICAS , North Sea and SE Asia. these region it self have subRegion,vesselName and vesselType values. I need to retrive unique value based on region, bacasue it contains many duplicate records. I have tried like as below, but it is not working me. Can anybody tel me how to achieve ?. great appreciated. Thank you.

var vesselStore=Ext.getStore('VesselStatusReportStore');
        var arr=new Array();
        var obj;      
        vesselStore.each(function(rec,index)
        {
            obj=new Object();
            if(rec.get('region')=='AMERICAS'){
                obj.subRegionAmerica=rec.get('subRegion');
                obj.vesselNameAmerica=rec.get('vesselName');
                obj.vesselTypeAmerica=rec.get('vesselType');
            }
            if(rec.get('region')=='NorthSea'){
                obj.subRegionNorthSea=rec.get('subRegion');
                obj.vesselNameNorthSea=rec.get('vesselName');
                obj.vesselTypeNorthSea=rec.get('vesselType');
            }
            if(rec.get('region')=='SE Asia'){
                obj.subRegionSEAsia=rec.get('subRegion');
                obj.vesselNameSEAsia=rec.get('vesselName');
                obj.vesselTypeSEAsia=rec.get('vesselType');
            }
            arr.push(obj);
            console.log(obj);
        });

Json:

[ { 
    "region" : "AMERICAS",
    "startDate" : null,
    "subRegion" : "US",
    "vesselName" : "Thoma-Sea � Hull #147",
    "vesselType" : "PSV"
  },
  { 
    "region" : "AMERICAS",
    "startDate" : null,
    "subRegion" : "US",
    "vesselName" : "Thoma-Sea � Hull #148",
    "vesselType" : "PSV"
  },
  { 
    "region" : "AMERICAS",
    "startDate" : null,
    "subRegion" : "Mexico",
    "vesselName" : "Thoma-Sea � Hull #148",
    "vesselType" : "PSV"
  }]

Answer 1

This section doesn't make sense:

            obj=new Object();
            if(rec.get('region')=='AMERICAS'){
                obj.subRegionAmerica=rec.get('subRegion');
                obj.vesselNameAmerica=rec.get('vesselName');
                obj.vesselTypeAmerica=rec.get('vesselType');
            }
            if(rec.get('region')=='NorthSea'){
                obj.subRegionNorthSea=rec.get('subRegion');
                obj.vesselNameNorthSea=rec.get('vesselName');
                obj.vesselTypeNorthSea=rec.get('vesselType');
            }
            if(rec.get('region')=='SE Asia'){
                obj.subRegionSEAsia=rec.get('subRegion');
                obj.vesselNameSEAsia=rec.get('vesselName');
                obj.vesselTypeSEAsia=rec.get('vesselType');
            }
            arr.push(obj);

You are basically saying "Whatever the region is, copy the record to obj, then add that obj to my array".

I believe you meant something more along these lines:

var vesselStore=Ext.getStore('VesselStatusReportStore');
var iRegions = [];

vesselStore.each(function(rec,index)
{
    var iRegionName = rec.get('region');

    // Make sure theres a array item with the region name,
    // if not create a blank array;
    iRegions[ iRegionName ] = iRegions[ iRegionName ] || [];

    // Add the record to its corresponding array item.
    // (If you don't want the full record, you can just get the
    // fields individually like you did in your code).
    iRegions[ iRegionName ] = rec;
}
console.log( iRegions );

Answer 2

It looks like you want to use collect. http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.Store-method-collect

vesselStore.collect('region')