CSS-ում կա {text-transform: capitalize} հատկությունը, որը տրված տեքստի յուրաքանչյուր բառի առաջին տառը վերափոխում է մեծատառի։ Մեր խնդիրն է JavaScript-ում ստեղծել ֆունկցիա, որը կանի նմանատիպ գործողություն։
Ֆունկցիան կարելի է իրականացնել տասնյակ տարբեր ձևերով, կներկայացնեմ այն տարբերակը, որը որ իմ սուբյեկտիվ կարծիքով պարզ է, համառոտ, և գերազանց կատարում է իր առջև դրված խնդիրը։
const capitalize = (text) =>
text
.toLowerCase()
.split(" ")
.map((s) => s.charAt(0).toUpperCase() + s.slice(1))
.join(" ");
const str = "lorem ipsum dolor sit amet, consectetur adipiscing elit.";
console.log(capitalize(str)); // "Lorem Ipsum Dolor Sit Amet, Consectetur Adipiscing Elit."
Իսկ հիմա քայլ առ քայլ նայենք թե ինչ է անում ֆունկցիան։ Այն որպես արգումենտ ստանում է տեքստը, որը մենք պատրաստվում ենք վերափոխել։ toLowerCase մեթոդի օգնությամբ ամբողջ տեքստը վերափոխում ենք փոքրատառի։ Սա արվում է խնդրի պահանջի անթերի կատարման համար, որովհետև այնտեղ նշվում է, որ տեքստի բառերի միայն առաջին տառերը լինեն մեծատառ։ Եվ եթե տեքստի մեջ լինի օրինակ "iPsUm"-ի նման խառը ռեգիստրով բառ, ապա այն կդառնա ամբողջովին փոքրատառ՝ "ipsum", որպեսզի արդեն հետո նոր կատարվի խնդրի հիմնական պահանջը։
split(" ") մեթոդին որպես արգումենտ հաղորդելով չակերտների մեջ ամփոփված բացատ, մենք տեքստը վերածում ենք բառերի զանգվածի։ Հետո այդ ստացված զանգվածի վրա կանչում ենք զանգվածների map մեթոդը։ map-ը պտտվում է ամբողջ զանգվածի վրայով, հերթով ստանալով զանգվածի էլեմենտները։ Հետադարձ ֆունկցիայի կանչի օգնությամբ այդ յուրաքանչյուր բառի 0-րդ ինդեքսում եղած տառը՝ առաջին տառը, toUpperCase մեթոդի օգնությամբ վերածում է մեծատառի։
Ապա դրան կպցնում է slice մեթոդի օգնությամբ ստացված, 1 ինդեքսից մինչև բառի վերջն եղած սիմվոլները։ slice մեթոդին շատ մանրամասն անդրադարձել եմ «Տեքստից ենթատողի ստացումը։ Ինչ մեթոդներ կան, որն է այդ մեթոդներից ամենաճկունը» գրառման մեջ, ով ուզում է,կարող է թարմացնել հիշողությունը։
map մեթոդի վերադարձրած զանգվածի վրա էլ միանգամից, էլի շղթայաձև կանչում ենք join մեթոդը, որը split մեթոդի հակապատկերն է, այսինքն զանգվածի էլեմենտներից ստեղծում է տող, որտեղ արգումենտի միջոցով մենք կարող ենք այս վերափոխման տրամաբանության վրա ազդեցություն ունենալ։ Կոնկրետ մեր պարագայում, որպես արգումենտ հաղորդելով չակերտների մեջ ամփոփված բացատ, ստանում ենք տող, որտեղ զանգվածի էլեմենտները միմյանից բաժանված են բացատներով։
Կան նաև regular expression-ով տվյալ խնդրի լուծման կարճ տարբերակներ․
const capitalize1 = (str) => str.replace(/\b./g, (x) => x.toUpperCase());
const capitalize2 = (str) => str.replace(/\b\w/g, (char) => char.toUpperCase());
const capitalize3 = (str) =>
str.replace(/(?:^|\s)\w/g, (char) => char.toUpperCase());