Teknik Grouping By Object Key di Javascript
cara mengelompokan objek berdasarkan key yang sama di javascript - halo.. pada kesempatan kali ini, saya akan memberikan tutorial singkat tentang cara grouping object berdasarkan key. Sebelum ke tutorialnya, saya akan menjelaskan tentang kegunaan grouping ini.
Objek tersebut terlihat terpisah satu sama lain. Misal, kita akan grouping objek tersebut berdasarkan key "merk". Jadi, mobil yang merknya sama akan tergabung dalam sebuah objek yang sama. Hasilnya akan seperti ini
Result Grouping By Merk:
Oke, sekian tutorial kali ini. Semoga bermanfaat! Terima Kasih!
Apa itu grouping by obeject key?
Sebenarnya, ini adalah teknik untuk mengubah arsitektur object menjadi lebih mudah dipahami, lebih singkat, dan lebih mudah diimplementasikan di client. Salah satu contohnya adalah seperti ini.
Misal, kita memiliki object
var mobil = [
{
'merk': 'audi',
'year': '2012'
},
{
'merk': 'audi',
'tahun': '2013'
},
{
'merk': 'ford',
'tahun': '2012'
},
{
'merk': 'ford',
'tahun': '2015'
},
{
'merk': 'kia',
'tahun': '2012'
},
]
Objek tersebut terlihat terpisah satu sama lain. Misal, kita akan grouping objek tersebut berdasarkan key "merk". Jadi, mobil yang merknya sama akan tergabung dalam sebuah objek yang sama. Hasilnya akan seperti ini
var mobil = {
'audi': [
{
'tahun': '2012'
},
{
'tahun': '2013'
},
],
'ford': [
{
'tahun': '2012'
},
{
'tahun': '2015'
}
],
'kia': [
{
'tahun': '2012'
}
]
}
Ini membuat object menjadi terstruktur, mudah dilihat, dan diimplementasikan. Oke, jadi bagaimana caranya?
Saya telah memiliki kode function ajaib untuk grouping object berdasarkan key. Berikut ini kodenya
function groupBy(xs, f) {
return xs.reduce((r, v, i, a, k = f(v)) => ((r[k] || (r[k] = [])).push(v), r), {});
}
Contoh Implementasi Kode
var mobil = [
{
'merk': 'audi',
'year': '2012'
},
{
'merk': 'audi',
'tahun': '2013'
},
{
'merk': 'ford',
'tahun': '2012'
},
{
'merk': 'ford',
'tahun': '2015'
},
{
'merk': 'kia',
'tahun': '2012'
},
]
var result = groupBy(mobil, (m) => m.merk)
Result Grouping By Merk:
{
'audi': [
{
'tahun': '2012'
},
{
'tahun': '2013'
},
],
'ford': [
{
'tahun': '2012'
},
{
'tahun': '2015'
}
],
'kia': [
{
'tahun': '2012'
}
]
}
Oke, sekian tutorial kali ini. Semoga bermanfaat! Terima Kasih!
Post a Comment