Filtrar datos de un json a partir de un key
@ JavaScript @ Permalink
Tienes un gran JSON plano compuesto por muchos objetos, compuestos a su vez por varios key-value (normal). Necesitas recomponer ese JSON para que los objetos queden filtrados por uno de sus key. Puede sonar extremadamente complejo pero créeme, con esta función lo reconsiderarás.
Comencemos con esta muestra:
var miData = [
{
category: 'animales',
name: 'Perro',
pic: 'http://url.a/la/foto'
},
{
category: 'cosas',
name: 'Silla',
pic: 'http://url.a/la/foto'
},
{
category: 'cosas',
name: 'Mesa',
pic: 'http://url.a/la/foto'
},
{
category: 'animales',
name: 'Gato',
pic: 'http://url.a/la/foto'
},
{
category: 'cosas',
name: 'Jarrón',
pic: 'http://url.a/la/foto'
}
];
Supongamos que necesitamos filtrar por category
. Al final tendremos la muestra compuesta por los keys animales
y cosas
que a su vez contendrán los objetos de cada caso.
NOTA: Esta función está limitada a solo un filtro porque está diseñada para un uso puntual. En nuestra muestra filtramos por
category
.
Para el efecto extendamos Array.prototype
con la propiedad keyFilter
para poder aplicarlo más cómodamente en nuestro código:
Array.prototype.keyFilter = function (fil)
{
var dat = this;
var datFil = {};
if ( fil )
{
for ( var i = 0, c = dat.length; i < c; i++ )
{
if ( !datFil[ dat[i][fil] ] ) datFil[ dat[i][fil] ] = [];
datFil[ dat[i][fil] ].push( dat[i] );
};
};
return datFil;
};
keyFilter
itera todos los objetos que componen el JSON para guardar el valor del key que definimos en fil
en la variable datFil
. Esos valores se convertirán entonces en los keys donde se guardarán los objetos filtrados.
Tu JSON define qué tantos keys principales compone el resultado, solo recuerda que no puedes definir más de un filtro en los argumentos. Veamos cómo aplicar la función:
var miDataFiltrada = miData.keyFilter('category');
console.log( miDataFiltrada );
// RESPUESTA: Object {animales: Array[2], cosas: Array[3]}
Así queda nuestro JSON filtrado:
var miDataFiltrada = {
animales: [
{
category: 'animales',
name: 'Perro',
pic: 'http://url.a/la/foto'
},
{
category: 'animales',
name: 'Gato',
pic: 'http://url.a/la/foto'
}
],
cosas: [
{
category: 'cosas',
name: 'Silla',
pic: 'http://url.a/la/foto'
},
{
category: 'cosas',
name: 'Mesa',
pic: 'http://url.a/la/foto'
},
{
category: 'cosas',
name: 'Jarrón',
pic: 'http://url.a/la/foto'
}
]
};
Que la fuerza te acompañe. :-)