Lodash-Titel (Großbuchstabe des ersten Buchstabens jedes Wortes)

106

Ich schaue mir die lodash-Dokumente und andere Fragen zum Stapelüberlauf an. Es gibt zwar mehrere native JavaScript-Methoden, um diese Aufgabe auszuführen , aber es gibt eine Möglichkeit, eine Zeichenfolge mit reinen lodash-Funktionen (oder zumindest vorhandenen prototypischen Funktionen) in eine Groß- und Kleinschreibung umzuwandeln. damit ich keinen regulären Ausdruck verwenden oder eine neue Funktion definieren muss?

z.B

This string ShouLD be ALL in title CASe

soll werden

This String Should Be All In Title Case
Brandonscript
quelle
3
Sie können das Gleiche auch aus HTML heraus tun: style = "text-transform: großschreiben"
Chaudhary

Antworten:

212

Dies kann mit einer kleinen Modifikation von startCase:

_.startCase(_.toLower(str));

4castle
quelle
3
_.startCase("aaa BBB ccc") === "Aaa BBB Ccc"
Brandon
2
Ich mag das. Ich wusste es nicht startCase.
Brandon
1
.startCase ("camelString") === "Camel String", aber _.startCase ( .toLower ("camelString")) === "Camelstring" scheint, dass lodash eine titleCase-Methode benötigt
aristidesfl
4
Ich mag das, aber es entfernt Zeichen wie :, das ist ein Problem.
JabberwockyDecompiler
1
Es funktioniert nicht für Vornamen mit Akzent (spanisch "Martínez Cortés Peña" wird zu "Martinez Cortes Pena") oder mit Bindestrichen (französisch "Jean-Louis" wird zu "Jean Louis"). Gleiches gilt für alle "* Case" -Funktionen von lodash
Flo
42
_.startCase(_.camelCase(str))

Bei nicht benutzergeneriertem Text werden mehr Fälle als die akzeptierte Antwort behandelt

> startCase(camelCase('myString'))
'My String'
> startCase(camelCase('my_string'))
'My String'
> startCase(camelCase('MY_STRING'))
'My String'
> startCase(camelCase('my string'))
'My String'
> startCase(camelCase('My string'))
'My String'
aristidesfl
quelle
26

mit lodash Version 4.

_.upperFirst(_.toLower(str))

James Nguyen
quelle
3
Dieser ist besser als startCaseweil er mehr Buchstaben als az verarbeiten kann, zum Beispiel å, ä und ö.
Lars Nyström
3
UpperFirst ändert nur das erste Zeichen des ersten Wortes, nicht für nachfolgende Wörter. Ich glaube nicht, dass dies aus diesem Grund besser ist als startCase.
Raghavan
15
'This string ShouLD be ALL in title CASe'
  .split(' ')
  .map(_.capitalize)
  .join(' ');
CD..
quelle
1
Auf jeden Fall das prägnanteste, wie es. Natürlich muss immer noch in ein Array aufgeteilt werden, aber das ist immer noch die kürzeste und süßeste Lösung, soweit ich das beurteilen kann. Außerdem sollte gemäß der Ausgabe 1528, die @AlexandreThebaldi angegeben hat, wahrscheinlich upperFirstanstelle von verwendet werden capitalize.
Brandonscript
... aber _.startCase gewinnt definitiv :)
Brandonscript
5
_.startCaseentfernt Interpunktion. Beispiel _.startCase('first second etc...gibt die Zeichenfolge zurückFirst Second Etc
LuckyStarr
Dies war besser für meinen Anwendungsfall, da startCasezum Beispiel alles in ein Leerzeichen konvertiert user_namewird User Name, und ich wollte nur User_namewie die text-transform: capitalizeEigenschaft von CSS
gonzarodriguezt
6

Es gibt gemischte Antworten auf diese Frage. Einige empfehlen die Verwendung, _.upperFirstandere empfehlen _.startCase.

Kennen Sie den Unterschied zwischen ihnen.

i) _.upperFirsttransformiert den ersten Buchstaben Ihrer Zeichenfolge, dann kann die Zeichenfolge aus einem einzelnen Wort oder mehreren Wörtern bestehen, aber der einzige erste Buchstabe Ihrer Zeichenfolge wird in Großbuchstaben umgewandelt.

_.upperFirst('jon doe')

Ausgabe:

Jon doe

Überprüfen Sie die Dokumentation https://lodash.com/docs/4.17.10#upperFirst

ii) _.startCasetransformiert den ersten Buchstaben jedes Wortes in Ihrer Zeichenfolge.

_.startCase('jon doe')

Ausgabe:

Jon Doe

https://lodash.com/docs/4.17.10#startCase

Vishal Shetty
quelle
Ja, aber was ist mit gemischten Fallzeichenfolgen? Keines davon wird 'jOn DoE' ohne 'Jon Doe' machen _.lower().
Brandonscript
3

Hier ist eine Möglichkeit, NUR lodash-Methoden und keine integrierten Methoden zu verwenden:

_.reduce(_.map(_.split("Hello everyOne IN the WOrld", " "), _.capitalize), (a, b) => a + " " + b)
Brandon
quelle
1
const titleCase = str =>
  str
    .split(' ')
    .map(str => {
      const word = str.toLowerCase()
      return word.charAt(0).toUpperCase() + word.slice(1)
    })
    .join(' ')

Sie können die Kartenfunktion auch aufteilen, um separate Wörter zu erstellen

Luke Robertson
quelle
0
 var s = 'This string ShouLD be ALL in title CASe';
 _.map(s.split(' '), (w) => _.capitalize(w.toLowerCase())).join(' ')

Sofern ich es nicht verpasst habe, hat lodash keine eigenen Methoden für Klein- / Großbuchstaben.

Agmcleod
quelle
@vbotio sieht aus wie _.upperFirstgilt nur für das erste Zeichen (ein Synonym für _.capitalize()?)
Brandonscript
1
capitalizeund upperFirstverschiedene Dinge tun.
Brandon
_.capitalize gilt für die gesamte Zeichenfolge
vbotio
0

Nicht so prägnant wie die Antwort von @ 4castle, aber dennoch beschreibend und voll ...

var basicTitleCase = _
    .chain('This string ShouLD be ALL in title CASe')
    .toLower()
    .words()
    .map(_.capitalize)
    .join(' ')
    .value()

console.log('Result:', basicTitleCase)
console.log('Exact Match:' , basicTitleCase === 'This String Should Be All In Title Case')
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.13.1/lodash.min.js"></script>

marcelino
quelle
Ich würde vermuten, dass die Ausführlichkeit und Länge der Antwort es fast unerwünscht macht. Ich habe nicht abgelehnt, aber es wäre nicht meine erste Wahl.
Brandonscript
0

Hier ist eine weitere Lösung für meinen Anwendungsfall: "Devil's Backbone"

Einfach:

function titleCase (str) {
  return _.map(str.split(' '), _.upperFirst).join(' ');
}

Die Verwendung von startCase würde das Apostroph entfernen, daher musste ich diese Einschränkung umgehen. Die anderen Lösungen schienen ziemlich kompliziert zu sein. Ich mag das, weil es sauber und leicht zu verstehen ist.

Albertpeiro
quelle
0

Dies kann nur mit lodash erfolgen

properCase = string =>
        words(string)
            .map(capitalize)
            .join(' ');

const proper = properCase('make this sentence propercase');

console.log(proper);
//would return 'Make This Sentence Propercase'
Justin Brown
quelle
Sie müssen Groß- und Kleinschreibung und Worte von lodash benötigen.
Justin Brown
Ja, aber Sie rufen die Funktionen nicht von lodash aus auf. es sei denn, Sie haben sie irgendwie var words = ._words
aliasiert
-1

Der folgende Code funktioniert einwandfrei:

var str = "TITLECASE";
_.startCase(str.toLowerCase());
Tarun Majumder
quelle
-3

mit lodash 4 können Sie _.capitalize () verwenden

_.capitalize('JOHN') Es gibt 'John' zurück

Weitere Informationen finden Sie unter https://lodash.com/docs/4.17.5#capitalize

LI Zhuoran
quelle
Wäre gut, den Anwendungsfall für einen Satz von Wörtern zu testen. Der Verdacht, dass dadurch nicht alle Anfangsbuchstaben jedes Wortes groß geschrieben werden.
Brandonscript
In der Tat gibt "der Satz" "Der Satz" aus
Andres Zapata