String dengan Format Capitalize di Javascript

Yudy Ananda
Yudy Ananda

Javascript tidak punya metode built in untuk merubah string dengan format capitalize. Untuk keperluan visual mungkin lebih praktis untuk ditangani oleh css saja, tapi gimana kalau ingin benar-benar merubahnya? Kalau begitu maka opsinya adalah membuat fungsi atau gunakan pustaka utilitas.

Fungsi

Di bawah ini adalah arrow function dengan 2 buah argumen, yaitu str untuk string itu sendiri dan lowerCase sebagai boolean dengan state false.

javascript
export const capitalize = (str, lowerCase = false) => {
const toLower = lowerCase ? str.toLowerCase() : str;
const changeCase = toLower.replace(/(?:^|\s|["'([{])+\S/g, match =>
match.toUpperCase()
);
if (typeof str !== 'string') {
return '';
}
return changeCase;
};
//Penggunaan
capitalize('raNDom STriNG'); // output: 'Random String'
capitalize('BIG THING'); // output: 'Big Thing'

Kita tidak akan pernah tahu format string yang akan dirubah—bisa jadi uppercase, lowercase bahkan random—oleh karena itu kita harus merubah string tersebut menjadi format yang pasti, seperti yang dilakukan oleh baris pertama yang ada dalam fungsi ini.

Berikutnya changeCase akan meloloskan string dari toLower menggunakan metode replace() dengan regex yang bekerja untuk mencari karakter pertama dan berikutnya sebelum akhirnya dirubah menjadi huruf kapital dengan metode toUpperCase.

Terakhir adalah memastikan jika str bertipe string, jika tidak kembalikan sebagai string yan kosong...

Lodash

Lodash adalah pustaka atau library utilitas yang punya metode cukup lengkap untuk urusan merubah format. Dalam kasus ini kita bisa memanfaatkan metode startCase().

javascript
import { startCase } from 'lodash';
const str = 'FoO bAR';
const toLower = str.toLowerCase();
startCase(toLower); // output: 'Foo Bar'

Selamat mencoba...

© 2021 Hobbious.com — dibuat dan ditenagai oleh Gatsby