JavaScript: Cara Cepat Mengubah Teks ke Title Case
1
min read .
Updated on
Kadang saya butuh bikin teks terlihat rapi—judul, nama, atau label UI. Manual kapitalisasi itu nyebelin. Untungnya, JavaScript bisa bantu dengan fungsi title case.
Fungsi titleCase
function titleCase(str) {
return str
.toLowerCase()
.split(" ")
.map(word => word[0].toUpperCase() + word.slice(1))
.join(" ");
}
Cara Kerjanya
-
Lowercase & Split:
str.toLowerCase().split(" ")
→ pastikan semua huruf kecil dulu, lalu pisah jadi kata-kata. -
Kapitalisasi Huruf Pertama:
.map(word => word[0].toUpperCase() + word.slice(1))
→ ambil huruf pertama tiap kata, bikin kapital, gabungkan lagi dengan sisanya. -
Gabungkan Lagi:
.join(" ")
→ jadikan string utuh lagi.
Contoh Penggunaan
console.log(titleCase("hello world")); // "Hello World"
console.log(titleCase("javascript is awesome")); // "Javascript Is Awesome"
console.log(titleCase("title case conversion")); // "Title Case Conversion"
Catatan
- Fungsi ini sederhana tapi cukup efektif buat teks pendek atau label UI.
- Kalau mau menangani kata-kata kecil seperti “and”, “the”, atau “of” agar tidak dikapitalisasi, tinggal tambahkan pengecekan ekstra di
.map()
.
Kesimpulan
Pada akhirnya, titleCase
bikin teks lebih rapi tanpa ribet. Snippet ini siap langsung dipakai di proyek, dari header sampai label UI. Gini deh, kadang hal kecil kayak ini bikin tampilan aplikasi kelihatan lebih profesional.