Sådan titler du en sætning i JavaScript

Husk i grundskolen, da dine lærere viste dig, hvordan du korrekt skrev et papir? Den første ting du starter med er en god titel, og enhver god titel er ordentligt aktiveret.

I løbet af denne algoritme-scripting-udfordring lærer vi, hvordan vi titler en sætning i JavaScript. I sidste ende vil vi have vores algoritme til at tage en sætning med store bogstaver i hvert ord, som om det var titlen på et papir.

Algoritme instruktioner

Returner den angivne streng med det første bogstav i hvert ord med store bogstaver. Sørg for, at resten af ​​ordet er med små bogstaver. I forbindelse med denne øvelse skal du også bruge store bogstaver som "the" og "of".

Medfølgende testtilfælde

  • titleCase("I'm a little tea pot")skal returnere en streng.
  • titleCase("I'm a little tea pot")skulle vende tilbage I'm A Little Tea Pot.
  • titleCase("sHoRt AnD sToUt")skulle vende tilbage Short And Stout.
  • titleCase("HERE IS MY HANDLE HERE IS MY SPOUT")skulle vende tilbage Here Is My Handle Here Is My Spout.

Løsning nr. 1: .map () og .slice ()

PEDAC

Forståelse af problemet : Vi har en input, en streng. Vores output er også en streng. I sidste ende ønsker vi at returnere inputstrengen med det første bogstav - og kun det første bogstav - i hvert ord med store bogstaver.

Eksempler / testtilfælde: Vores leverede testtilfælde viser, at vi kun skal have et stort bogstav i begyndelsen af ​​hvert ord. Vi har brug for små bogstaver resten. De medfølgende testtilfælde viser også, at vi ikke smider nogen kurvekugler med hensyn til underlige sammensatte ord adskilt af symboler i stedet for mellemrum. Det er gode nyheder for os!

Datastruktur : Vi bliver nødt til at omdanne vores inputstreng til en matrix for at manipulere hvert ord separat.

Et par noter om de metoder, vi bruger:

Lad os tale om .map():

.map() opretter et nyt array med resultaterne af at kalde en funktion på hvert element i arrayet.

.map()Tillader os med andre ord at manipulere hvert element i et array med en funktion og derefter returnere et nyt array med resultaterne af vores manipulation. Funktionen kan målrette mod både den aktuelle værdi og indekset for den aktuelle værdi som sådan:

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

Vi behøver ikke altid at bruge indekset. Der vil dog være tidspunkter, hvor vi skal målrette mod elementer i en matrix ved hjælp af deres indeks, så det er praktisk at huske på.

Lad os nu se et eksempel på .map()i aktion. Vi har en matrix fuld af tal, og vi vil gange hvert nummer med 2.

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

Lad os nu undersøge .slice():

.slice()udtrækker et afsnit af en streng og returnerer det som en ny streng. Hvis du kalder .slice()på en streng uden at videregive den yderligere oplysninger, returnerer den hele strengen.

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

Vi har mulighed for at videregive .slice()en beginIndex og endIndex som sådan

.slice(beginIndex, endIndex)

Dette fortæller, .slice()hvor udskæringen skal startes, og hvor udskæringen skal afsluttes. Husk, at strenge er nulindekseret! Så hvis vi ønskede at vende tilbage fra det 2-indekserede bogstav i "Bastian" indtil men ikke inkluderer det 5-indekserede bogstav i "Bastian", kunne vi gøre dette:

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

Med det i tankerne kan vi hugge begyndelsen af ​​ord og returnere resten af ​​dem ved kun at videregive en beginIndex som sådan:

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

Algoritme :

  1. Vend alle bogstaverne strtil små bogstaver.
  2. Del små bogstaver stri en matrix, hvor hvert ord er et separat element i arrayet.
  3. Brug det første bogstav i hvert element i arrayet med store bogstaver.
  4. Deltag hvert element i arrayet i en streng, og adskilt hvert ord med et mellemrum.
  5. Returner titelstrenget.

Kode : Se nedenfor!

Jeg oprettede en masse unødvendige lokale variabler i ovenstående kode for at vise effekten af ​​hver metode på input. Nedenfor har jeg fjernet de lokale variabler, lænket alle metoderne sammen og fjernet kommentarerne.

Løsning nr. 2: regex

Advarsel! Regex er ikke den bedste løsning for begyndere. Regulære udtryk er vanskelige i sig selv, og deres kompleksitet er et almindeligt greb for mange erfarne udviklere. Men hej, jeg føler mig eventyrlysten, mens jeg skriver dette, og jeg elsker at udfordre mig selv til yderligere at forstå regex, når jeg kan. Denne algoritme-scripting-udfordring egner sig faktisk godt til regex, så lad os se på det og se, om vi kan fremme vores forståelse af regex!

PEDAC

Forståelse af problemet : Vi har en input, en streng. Vores output er også en streng. I sidste ende ønsker vi at returnere inputstrengen med det første bogstav - og kun det første bogstav - i hvert ord med store bogstaver.

Eksempler / testtilfælde: Vores leverede testtilfælde viser, at vi kun skal have et stort bogstav i begyndelsen af ​​hvert ord. Vi har brug for små bogstaver resten. De medfølgende testtilfælde viser også, at vi ikke smider nogen kurvekugler med hensyn til underlige sammensatte ord adskilt af symboler i stedet for mellemrum. Det er gode nyheder for os!

Datastruktur : Vi transformerer ikke vores streng til en matrix, mens vi bruger regulære udtryk. JavaScript har en smidig metode, .replace()der giver os mulighed for at målrette stort set alt hvad vi vil i en streng og erstatte det med noget andet. Vi bruger regulære udtryk til at målrette mod det, vi vil erstatte.

Der er så mange symboler, der bruges i regulære udtryk, at jeg ikke håber at give et bredt overblik over dem her. Jeg kan dog pege dig mod dette cheatsheet, som jeg bruger, når jeg skal bruge regex.

Hvad jeg kan gøre er at fortælle dig, at regex med .replace()i JavaScript følger et grundlæggende mønster. .replace()tager to argumenter: et mønster (normalt et regulært udtryk) og en erstatning (kan være en streng eller en funktion).

string.replace(regex, function)

I vores løsning erstatter vi brevet i begyndelsen af ​​hvert ord. Hvordan får vi regex til at gøre dette for os? Vi beder om .replace()at matche ethvert tegn, der følger et mellemrum eller matche det første tegn i hele strengen (fordi det allerførste ord i strengen ikke har et mellemrum før det).

Lad os nedbryde regex-delen af ​​vores løsning. For at gøre det skal vi se på det første argument for .replace()funktionen. Dette er regex-koden, der bestemmer, hvilket mønster vi ønsker at matche og erstatte.

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

Vi vil i sidste ende finde alle tegn, der ikke er mellemrum, hvilket er repræsenteret af \S.

Derefter ønsker vi at specificere, at vi vil matche disse ikke-mellemrumstegn i begyndelsen af ​​en streng ^eller |efter et hvilket som helst mellemrumstegn \s.

Vi tilføjer den globale modifikator for gat søge efter og erstatte alle sådanne mønstre i hele strengen.

Algoritme :

  1. Vend alle bogstaverne strtil små bogstaver.
  2. Udskift det første bogstav i hvert ord i strengen med det store bogstav.
  3. Returner titelstrenget.

Kode : Se nedenfor!

Hvis du har andre løsninger og / eller forslag, bedes du dele i kommentarerne!

Denne artikel er en del af serien freeCodeCamp Algorithm Scripting.

Denne artikel henviser til freeCodeCamp Basic Algorithm Scripting: Title Case a Sentence

Du kan følge mig på Medium, LinkedIn og GitHub!