Hogyan írhatunk kis- és nagybetűt egy mondatnak a JavaScript-ben

Emlékszel az általános iskolában, amikor a tanáraid megmutatták, hogyan kell helyesen írni egy papírt? Az első dolog, amivel elindul, az a jó cím, és minden jó címet nagybetűvel írnak.

Ezen algoritmus-szkriptelési kihívás során megtanuljuk, hogyan kell egy mondatot kis- és nagybetűkkel elnevezni JavaScript-ben. Végül azt fogjuk kapni, hogy az algoritmusunk befogadjon egy mondatot, és minden szó első betűjét nagybetűvel írja, mintha egy cikk címe lenne.

Algoritmus utasítások

Tegye vissza a megadott karakterláncot az egyes szavak nagybetűvel írt első betűjével. Győződjön meg arról, hogy a szó többi része kisbetűvel van-e írva. E gyakorlat céljából az összekötő szavakat is nagybetűvel kell írni, mint például a „a” és „of”.

Biztosított tesztesetek

  • titleCase("I'm a little tea pot")karakterláncot kell visszaadnia.
  • titleCase("I'm a little tea pot")vissza kell térnie I'm A Little Tea Pot.
  • titleCase("sHoRt AnD sToUt")vissza kell térnie Short And Stout.
  • titleCase("HERE IS MY HANDLE HERE IS MY SPOUT")vissza kell térnie Here Is My Handle Here Is My Spout.

1. megoldás: .map () és .slice ()

PEDAC

A probléma megértése : Van egy bevitelünk, egy karakterlánc. A kimenetünk szintén karakterlánc. Végül vissza akarjuk adni a bemeneti karakterláncot az egyes nagybetűk első betűjével - és csak az első betűjével.

Példák / tesztesetek : A megadott teszteseteink azt mutatják, hogy csak az egyes szavak elején nagybetűvel kell rendelkeznünk. A többit kisbetűvel kell ellátnunk. A rendelkezésre álló tesztesetek azt is mutatják, hogy a furcsa összetett szavak tekintetében a szóközök helyett szimbólumokkal elválasztott furcsa összetett szavakat nem dobunk el. Ez jó hír számunkra!

Adatszerkezet : A bemeneti karakterláncot tömbökké kell alakítanunk annak érdekében, hogy az egyes szavakat külön kezeljük.

Néhány megjegyzés az általunk alkalmazott módszerekről:

Beszéljünk a következőkről .map():

.map() új tömböt hoz létre a függvény meghívásának eredményeivel a tömb minden elemén.

Más szavakkal, .map()lehetővé teszi számunkra, hogy egy tömbben az egyes elemeket egy függvénnyel manipuláljuk, majd egy új tömböt adjunk vissza a manipulációnk eredményeivel. A függvény megcélozhatja a currentValue jelenlegi értékét és indexét is, így:

array.map((currentValue, Index) => { // manipulate the currentValue in some way})

Nem mindig kell használnunk az Indexet. Van azonban idő, amikor a tömb elemeit indexük alapján kell megcéloznunk, ezért hasznos szem előtt tartani.

Most lássunk egy példát a .map()működésre. Van egy tömb, tele számokkal, és minden számot meg akarunk szorozni 2-vel.

let arrayOfNumbers = [3, 6, 10, 42, 98]arrayOfNumbers.map(number => number * 2)// returns [6, 12, 20, 84, 196]

Most vizsgáljuk meg .slice():

.slice()kivonja a karakterlánc egy szakaszát, és új stringként adja vissza. Ha .slice()egy karakterláncot hív be anélkül, hogy bármilyen további információt továbbítana neki, az az egész karakterláncot adja vissza.

"Bastian".slice()// returns "Bastian"

Lehetőségünk van átadni .slice()egy beginIndex és endIndex-t, így

.slice(beginIndex, endIndex)

Ez megmondja, .slice()hol kezdje a szeletelést és hol fejezze be a szeletelést. Ne feledje, hogy a karakterláncok nulla indexelésűek! Tehát, ha vissza akarunk térni a „Bastian” 2 indexelt betűjéről, de az 5 indexelt „Bastian” betű nélkül, akkor ezt megtehetnénk:

"Bastian".slice(2, 5)// returns "sti"

Ezt szem előtt tartva levághatjuk a szavak elejét, és a többit visszaküldhetjük, ha csak egy beginIndex-et adunk meg:

"Bastian".slice(3)// returns "tian"

Algoritmus :

  1. Az összes betűt fordítsa strkisbetűvé.
  2. Ossza fel a kisbetűket strtömbre, úgy, hogy minden szó külön elem legyen a tömbben.
  3. A tömb minden elemének első betűjét nagybetűvel írja.
  4. Csatlakoztassa a tömb egyes elemeit egy karaktersorozatba, elválasztva az egyes szavakat egy szóközzel.
  5. Adja vissza a címsoros karakterláncot.

Kód : Lásd alább!

Sok fölösleges helyi változót hoztam létre a fenti kódban, hogy bemutassam az egyes módszerek hatását a bemenetre. Az alábbiakban eltávolítottam a helyi változókat, láncoltam az összes metódust és eltávolítottam a megjegyzéseket.

2. megoldás: regex

Figyelem! A Regex nem a legjobb megoldás a kezdők számára. A reguláris kifejezések önmagukban nehézek, összetettségük sok tapasztalt fejlesztő számára közös fogás. De hé, kalandosnak érzem magam, miközben ezt írom, és szeretek kihívást jelenteni magamnak, hogy minél jobban megértsem a regexet. Ez az algoritmus szkriptelési kihívás valójában alkalmas a regexelésre, ezért vessünk egy pillantást rá, és hátha tovább tudjuk ismerni a regexet!

PEDAC

A probléma megértése : Van egy bevitelünk, egy karakterlánc. A kimenetünk szintén karakterlánc. Végül vissza akarjuk adni a bemeneti karakterláncot az egyes nagybetűk első betűjével - és csak az első betűjével.

Példák / tesztesetek : A megadott teszteseteink azt mutatják, hogy csak az egyes szavak elején nagybetűvel kell rendelkeznünk. A többit kisbetűvel kell ellátnunk. A rendelkezésre álló tesztesetek azt is mutatják, hogy a furcsa összetett szavak tekintetében a szóközök helyett szimbólumokkal elválasztott furcsa összetett szavakat nem dobunk el. Ez jó hír számunkra!

Adatszerkezet : A karakterláncunkat nem alakítjuk tömbgé, miközben reguláris kifejezéseket használunk. A JavaScript rendelkezik egy remek módszerrel, .replace()amely lehetővé teszi számunkra, hogy nagyjából bármit megcélozzunk egy stringben, és helyettesítsük valamivel mással. Rendszeres kifejezésekkel célozzuk meg, hogy mit is akarunk cserélni.

Olyan sok szimbólumot használunk a reguláris kifejezésekben, hogy itt nem remélem, hogy átfogó képet adok róluk. Ennek a csalólapnak a felé mutathatok, amelyet mindig használok, amikor regexet kell alkalmaznom.

Azt tehetem, hogy elmondom, hogy a regex a .replace()JavaScript-ben egy alapmintát követ. .replace()két érvet vesz fel: egy mintát (általában reguláris kifejezést) és egy helyettesítést (lehet egy karakterlánc vagy függvény).

string.replace(regex, function)

Megoldásunkban minden szó elején kicseréljük a betűt. Hogyan juthatunk hozzá a regexhez, hogy ezt megtegyük helyettünk? Azt mondjuk, .replace()hogy illesszen bármely karaktert egy szóköz után, vagy illessze az egész karakterlánc első karakterét (mert a karakterlánc legelső szavának nincs előtagja).

Bontjuk le megoldásunk regex részét. Ehhez nézzük meg a .replace()függvény első argumentumát . Ez az a regex kód, amely meghatározza, hogy milyen mintát akarunk illeszteni és cserélni.

// full solution:
function titleCase(str)  return str.toLowerCase().replace(/(^

Végül meg akarjuk találni az összes nem fehér szóköz karaktert, amelyet a \S.

Ezután meg akarjuk határozni, hogy ezeket a nem fehér szóköz karaktereket meg akarjuk egyezni a karakterlánc elején ^vagy |bármely szóköz karakter után \s.

A globális módosítót hozzáadjuk az gösszes ilyen minta kereséséhez és cseréjéhez a teljes karaktersorozatban.

Algoritmus :

  1. Az összes betűt fordítsa strkisbetűvé.
  2. Cserélje ki a karakterláncban szereplő egyes szavak első betűjét nagybetűvel.
  3. Adja vissza a címsoros karakterláncot.

Kód : Lásd alább!

Ha van más megoldása és / vagy javaslata, kérjük, ossza meg a megjegyzéseket!

Ez a cikk a freeCodeCamp algoritmus szkriptek sorozatának része.

Ez a cikk az freeCodeCamp Basic Algorithm Scripting: Title Case a Sentence hivatkozásra hivatkozik

Kövess engem a Mediumon, a LinkedIn-en és a GitHubon!