Как да изписвате с главна буква първата буква от всяка дума в JavaScript - урок за JS главни букви

В тази статия ще научите как да пишете с главна буква първата буква на която и да е дума в JavaScript. След това ще изписвате с главна буква първата буква от всички думи от изречение.

Най-красивото при програмирането е, че няма универсално решение за решаване на проблем. Следователно в тази статия ще видите множество начини за решаване на един и същ проблем.

Пишете с главна буква първата буква на думата

На първо място, нека започнем с главни букви на първата буква от една дума. След като научите как да направите това, ще преминем към следващото ниво - като го правим на всяка дума от изречение. Ето пример:

const publication = "freeCodeCamp"; 

В JavaScript започваме да броим от 0. Например, ако имаме масив, първата позиция е 0, а не 1.

Също така можем да осъществим достъп до всяка буква от String по същия начин, по който имаме достъп до елемент от масив. Например първата буква от думата " freeCodeCamp " е на позиция 0.

Това означава, че можем да получим буквата f от freeCodeCamp, като правим publication[0].

По същия начин можете да получите достъп до други букви от думата. Можете да замените "0" с произволно число, стига да не надвишавате дължината на думата. Като превишавам дължината на думата, имам предвид да се опитам да направя нещо подобно publication[25, което хвърля грешка, защото в думата „freeCodeCamp“ има само дванадесет букви.

Как да изписвате с главна буква първата буква

Сега, когато знаем как да осъществим достъп до писмо от дадена дума, нека го изписваме с главни букви.

В JavaScript има метод, наречен toUpperCase(), който можем да извикаме на низове или думи. Както можем да подразбираме от името, вие го извиквате на низ / дума и то ще върне същото нещо, но като главна буква.

Например:

const publication = "freeCodeCamp"; publication[0].toUpperCase(); 

Изпълнявайки горния код, ще получите главна буква F вместо f. За да върнем цялата дума, можем да направим това:

const publication = "freeCodeCamp"; publication[0].toUpperCase() + publication.substring(1); 

Сега той свързва "F" с "reeCodeCamp", което означава, че връщаме думата "FreeCodeCamp". Това е всичко!

Нека да обобщим

За да сме сигурни, че нещата са ясни, нека да обобщим наученото до момента:

  • В JavaScript броенето започва от 0.
  • Можем да получим достъп до писмо от низ по същия начин, по който имаме достъп до елемент от масив - напр string[index].
  • Не използвайте индекс, който надвишава дължината на низа (използвайте метода за дължина - string.length- за да намерите диапазона, който можете да използвате).
  • Използвайте вградения метод toUpperCase()за буквата, която искате да преобразувате в главни букви.

Капитализирайте първата буква на всяка дума от низ

Следващата стъпка е да вземете изречение и да изписвате с главни букви всяка дума от това изречение. Нека вземем следното изречение:

const mySentence = "freeCodeCamp is an awesome resource"; 

Разделете го на думи

Трябва да напишем с главна буква първата буква от всяка дума от изречението freeCodeCamp is an awesome resource.

Първата стъпка, която предприемаме, е да разделим изречението на набор от думи. Защо? Така че можем да манипулираме всяка дума поотделно. Можем да направим това, както следва:

const mySentence = "freeCodeCamp is an awesome resource"; const words = mySentence.split(" "); 

Итерирайте над всяка дума

След като изпълним горния код, на променливата wordsсе присвоява масив с всяка дума от изречението. Масивът е както следва ["freeCodeCamp", "is", "an", "awesome", "resource"].

const mySentence = "freeCodeCamp is an awesome resource"; const words = mySentence.split(" "); for (let i = 0; i < words.length; i++) { words[i] = words[i][0].toUpperCase() + words[i].substr(1); } 

Следващата стъпка е да прелезем върху масива от думи и да напишем с главна буква първата буква на всяка дума.

В горния код всяка дума се приема отделно. След това изписва с главна буква първата буква и в крайна сметка обединява заглавната първа буква с останалата част от низа.

Присъединете се към думите

Какво прави горният код? Той се итерира над всяка дума и я заменя с главни букви на първата буква + останалата част от низа.

Ако вземем за пример "freeCodeCamp", той изглежда така freeCodeCamp = F + reeCodeCamp.

След като се итерира над всички думи, wordsмасивът е ["FreeCodeCamp", "Is", "An", "Awesome", "Resource"]. Имаме обаче масив, а не низ, което не е това, което искаме.

Последната стъпка е да обедините всички думи, за да образувате изречение. И така, как да го направим?

В JavaScript имаме извикан метод join, който можем да използваме за връщане на масив като низ. Методът приема разделител като аргумент. Тоест, ние посочваме какво да добавяме между думи, например интервал.

const mySentence = "freeCodeCamp is an awesome resource"; const words = mySentence.split(" "); for (let i = 0; i < words.length; i++) { words[i] = words[i][0].toUpperCase() + words[i].substr(1); } words.join(" "); 

В горния кодов фрагмент можем да видим метода на присъединяване в действие. Извикваме го в wordsмасива и указваме разделителя, който в нашия случай е интервал.

Следователно, ["FreeCodeCamp", "Is", "An", "Awesome", "Resource"]става FreeCodeCamp Is An Awesome Resource.

Други методи

При програмирането обикновено има множество начини за решаване на един и същ проблем. Така че нека видим друг подход.

const mySentence = "freeCodeCamp is an awesome resource"; const words = mySentence.split(" "); words.map((word) => { return word[0].toUpperCase() + word.substring(1); }).join(" "); 

What is the difference between the above solution and the initial solution? The two solutions are very similar, the difference being that in the second solution we are using the map function, whereas in the first solution we used a for loop.

Let's go even further, and try to do a one-liner. Be aware! One line solutions might look cool, but in the real world they are rarely used because it is challenging to understand them. Code readability always comes first.

const mySentence = "freeCodeCamp is an awesome resource"; const finalSentence = mySentence.replace(/(^\w{1})|(\s+\w{1})/g, letter => letter.toUpperCase()); 

The above code uses RegEx to transform the letters. The RegEx might look confusing, so let me explain what happens:

  • ^ matches the beginning of the string.
  • \w matches any word character.
  • {1} takes only the first character.
  • Thus, ^\w{1} matches the first letter of the word.
  • | works like the boolean OR. It matches the expression after and before the |.
  • \s+ matches any amount of whitespace between the words (for example spaces, tabs, or line breaks).

Thus, with one line, we accomplished the same thing we accomplished in the above solutions. If you want to play around with the RegEx and to learn more, you can use this website.

Conclusion

Congratulations, you learnt a new thing today! To recap, in this article, you learnt how to:

  • access the characters from a string
  • capitalize the first letter of a word
  • split a string in an array of words
  • join back the words from an array to form a string
  • use RegEx to accomplish the same task

If you like what I write, the chances are you would love what I email. Consider subscribing to my mailing list. If you're not a fan of newsletters, we can always keep in touch on Twitter.