Qual é a melhor abordagem para colocar letras maiúsculas em uma string?
Qual é a melhor abordagem para colocar letras maiúsculas em uma string?
Respostas:
/**
* Capitalizes first letters of words in string.
* @param {string} str String to be modified
* @param {boolean=false} lower Whether all other letters should be lowercased
* @return {string}
* @usage
* capitalize('fix this string'); // -> 'Fix This String'
* capitalize('javaSCrIPT'); // -> 'JavaSCrIPT'
* capitalize('javaSCrIPT', true); // -> 'Javascript'
*/
const capitalize = (str, lower = false) =>
(lower ? str.toLowerCase() : str).replace(/(?:^|\s|["'([{])+\S/g, match => match.toUpperCase());
;
capitalize(' javascript'); // -> ' Javascript'
capitalize('бабушка курит трубку'); // -> 'Бабушка Курит Трубку'
capitalize('località àtilacol') // -> 'Località Àtilacol'
capitalize(`"quotes" 'and' (braces) {braces} [braces]`); // -> "Quotes" 'And' (Braces) {Braces} [Braces]
'CHECK THIS OUT'.capitalize(true) -> "Check This Out"
,. true
Parâmetro da mente .
A implementação mais curta para colocar letras maiúsculas em uma string é a seguinte, usando as funções de seta do ES6:
'your string'.replace(/\b\w/g, l => l.toUpperCase())
// => 'Your String'
Implementação compatível com ES5:
'your string'.replace(/\b\w/g, function(l){ return l.toUpperCase() })
// => 'Your String'
A regex corresponde basicamente à primeira letra de cada palavra dentro da sequência especificada e transforma apenas essa letra em maiúscula:
'ÿöur striñg'.replace(/(^|\s)\S/g, l => l.toUpperCase())
Essa regex corresponde à primeira letra e a todas as letras que não sejam espaços em branco precedidas por espaços em branco na cadeia especificada e transforma apenas essa letra em maiúscula:
Um grupo de não captura poderia ter sido usado aqui da seguinte maneira, /(?:^|\s)\S/g
embora o g
sinalizador em nosso regex não capture os subgrupos por design de qualquer maneira.
Felicidades!
päijät-häme
tornaPäIjäT-HäMe
EisbäRen
é um resultado, por exemplo.
Päijät-Häme
, mas pelo menos no espaço em branco do Chrome não inclui o traço (-), portanto, a segunda parte do nome não é maiúscula. Pode ser corrigido como /(^|\s|-)\S/g
.
function capitalize(s){
return s.toLowerCase().replace( /\b./g, function(a){ return a.toUpperCase(); } );
};
capitalize('this IS THE wOrst string eVeR');
output: "Esta é a pior string de todos os tempos"
Parece que esta solução substitui a minha: https://stackoverflow.com/a/7592235/104380
A resposta fornecida pelo vsync funciona desde que você não tenha letras acentuadas na string de entrada.
Eu não sei o motivo, mas aparentemente as \b
correspondências in regexp também acentuam as letras (testadas no IE8 e no Chrome), portanto, uma string como "località"
seria incorretamente maiúscula convertida em"LocalitÀ"
(a à
letra fica maiúscula porque o regexp acha que é um limite de palavra)
Uma função mais geral que também funciona com letras acentuadas é esta:
String.prototype.toCapitalize = function()
{
return this.toLowerCase().replace(/^.|\s\S/g, function(a) { return a.toUpperCase(); });
}
Você pode usá-lo assim:
alert( "hello località".toCapitalize() );
" javascript".toCapitalize() -> " javascript"
Como todos lhe deram a resposta JavaScript solicitada, mostrarei a propriedade CSS text-transform: capitalize
fará exatamente isso.
Sei que isso pode não ser o que você está pedindo - você não nos forneceu nenhum contexto em que está executando isso - mas se for apenas para apresentação, eu definitivamente aceitaria a alternativa CSS.
John Resig (da fama do jQuery) portou um script perl, escrito por John Gruber, para JavaScript. Esse script usa letras maiúsculas de uma maneira mais inteligente, não usa letras minúsculas como 'of' e 'and' por exemplo.
Você pode encontrá-lo aqui: Título em maiúsculas em JavaScript
Usando JavaScript e html
String.prototype.capitalize = function() {
return this.replace(/(^|\s)([a-z])/g, function(m, p1, p2) {
return p1 + p2.toUpperCase();
});
};
<form name="form1" method="post">
<input name="instring" type="text" value="this is the text string" size="30">
<input type="button" name="Capitalize" value="Capitalize >>" onclick="form1.outstring.value=form1.instring.value.capitalize();">
<input name="outstring" type="text" value="" size="30">
</form>
Basicamente, você pode fazer string.capitalize()
e ele irá capitalizar cada primeira letra de cada palavra.
Fonte: http://www.mediacollege.com/internet/javascript/text/case-capitalize.html
if (object.capitalize) {...} else {String.prototype.capitalize = function()....}
onde objeto é do tipo String
. Então, é bem simples mesmo.
A resposta de Ivo é boa, mas prefiro não corresponder \w
porque não há necessidade de capitalizar 0-9 e AZ. Podemos ignorá-los e corresponder apenas a az.
'your string'.replace(/\b[a-z]/g, match => match.toUpperCase())
// => 'Your String'
É a mesma saída, mas acho mais claro em termos de código de auto-documentação.
"Är Toaletten"
. Sua resposta, anos após o fornecimento de uma resposta muito boa, não contribui para a discussão.
/\b\w/g
também falha em letras que não estão em inglês. Nem todo mundo lida com caracteres unicode, e isso ajudará aqueles que querem não.
console.log( _.capitalize('ÿöur striñg') );
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js"></script>
Uma maneira concisa do ES6 de fazer isso pode ser algo assim.
const capitalizeFirstLetter = s => s.charAt(0).toUpperCase() + s.slice(1)
Isso apenas maiúscula a primeira letra e não afeta o restante da caixa da frase.
Minha solução:
String.prototype.toCapital = function () {
return this.toLowerCase().split(' ').map(function (i) {
if (i.length > 2) {
return i.charAt(0).toUpperCase() + i.substr(1);
}
return i;
}).join(' ');
};
Exemplo:
'álL riGht'.toCapital();
// Returns 'Áll Right'
'a áAA. bb . bbb .cc .d'.toCapital();
=>a Áaa. bb . Bbb .cc .d
Isso deve cobrir os casos de uso mais básicos.
const capitalize = (str) => {
if (typeof str !== 'string') {
throw Error('Feed me string')
} else if (!str) {
return ''
} else {
return str
.split(' ')
.map(s => {
if (s.length == 1 ) {
return s.toUpperCase()
} else {
const firstLetter = s.split('')[0].toUpperCase()
const restOfStr = s.substr(1, s.length).toLowerCase()
return firstLetter + restOfStr
}
})
.join(' ')
}
}
capitalize('THIS IS A BOOK') // => This Is A Book
capitalize('this is a book') // => This Is A Book
capitalize('a 2nd 5 hour boOk thIs weEk') // => A 2nd 5 Hour Book This Week
Editar: Legibilidade aprimorada do mapeamento.
/\b\w/g
...
Esta solução não utiliza regex, suporta caracteres acentuados e também é suportada por quase todos os navegadores.
function capitalizeIt(str) {
if (str && typeof(str) === "string") {
str = str.split(" ");
for (var i = 0, x = str.length; i < x; i++) {
if (str[i]) {
str[i] = str[i][0].toUpperCase() + str[i].substr(1);
}
}
return str.join(" ");
} else {
return str;
}
}
Uso:
console.log (capitalizeIt ('segundo programa Javascript dentro'));
Resultado:
2º Programa Javascript Interno
http://www.mediacollege.com/internet/javascript/text/case-capitalize.html é uma das muitas respostas disponíveis.
O Google pode ser tudo o que você precisa para esses problemas.
Uma abordagem ingênua seria dividir a string por espaços em branco, colocar em maiúscula a primeira letra de cada elemento da matriz resultante e juntá-la novamente. Isso deixa a capitalização existente em paz (por exemplo, o HTML permanece HTML e não se torna algo bobo como o Html). Se você não quer esse efeito, transforme a corda inteira em minúscula antes de dividi-la.
Esse código coloca em maiúscula as palavras após o ponto:
function capitalizeAfterPeriod(input) {
var text = '';
var str = $(input).val();
text = convert(str.toLowerCase().split('. ')).join('. ');
var textoFormatado = convert(text.split('.')).join('.');
$(input).val(textoFormatado);
}
function convert(str) {
for(var i = 0; i < str.length; i++){
str[i] = str[i].split('');
if (str[i][0] !== undefined) {
str[i][0] = str[i][0].toUpperCase();
}
str[i] = str[i].join('');
}
return str;
}
Eu gosto de ir com processo fácil. Primeiro, altere a string para Array para facilitar a iteração; depois, usando a função map, altere cada palavra como você deseja.
function capitalizeCase(str) {
var arr = str.split(' ');
var t;
var newt;
var newarr = arr.map(function(d){
t = d.split('');
newt = t.map(function(d, i){
if(i === 0) {
return d.toUpperCase();
}
return d.toLowerCase();
});
return newt.join('');
});
var s = newarr.join(' ');
return s;
}
Jquery ou Javascipt não fornece um método interno para conseguir isso.
A transformação de teste CSS (transformação de texto: capitalizar;) realmente não capitaliza os dados da sequência, mas mostra uma renderização capitalizada na tela.
Se você está procurando uma maneira mais legítima de conseguir isso no nível de dados usando o vanillaJS comum, use esta solução =>
var capitalizeString = function (word) {
word = word.toLowerCase();
if (word.indexOf(" ") != -1) { // passed param contains 1 + words
word = word.replace(/\s/g, "--");
var result = $.camelCase("-" + word);
return result.replace(/-/g, " ");
} else {
return $.camelCase("-" + word);
}
}
Usa isto:
String.prototype.toTitleCase = function() {
return this.charAt(0).toUpperCase() + this.slice(1);
}
let str = 'text';
document.querySelector('#demo').innerText = str.toTitleCase();
<div class = "app">
<p id = "demo"></p>
</div>
Você pode usar o seguinte para colocar em maiúscula as palavras em uma sequência:
function capitalizeAll(str){
var partes = str.split(' ');
var nuevoStr = "";
for(i=0; i<partes.length; i++){
nuevoStr += " "+partes[i].toLowerCase().replace(/\b\w/g, l => l.toUpperCase()).trim();
}
return nuevoStr;
}
Também há locutus: https://locutus.io/php/strings/ucwords/, que define desta maneira:
function ucwords(str) {
// discuss at: http://locutus.io/php/ucwords/
// original by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)
// improved by: Waldo Malqui Silva (http://waldo.malqui.info)
// improved by: Robin
// improved by: Kevin van Zonneveld (http://kvz.io)
// bugfixed by: Onno Marsman (https://twitter.com/onnomarsman)
// bugfixed by: Cetvertacov Alexandr (https://github.com/cetver)
// input by: James (http://www.james-bell.co.uk/)
// example 1: ucwords('kevin van zonneveld')
// returns 1: 'Kevin Van Zonneveld'
// example 2: ucwords('HELLO WORLD')
// returns 2: 'HELLO WORLD'
// example 3: ucwords('у мэри был маленький ягненок и она его очень любила')
// returns 3: 'У Мэри Был Маленький Ягненок И Она Его Очень Любила'
// example 4: ucwords('τάχιστη αλώπηξ βαφής ψημένη γη, δρασκελίζει υπέρ νωθρού κυνός')
// returns 4: 'Τάχιστη Αλώπηξ Βαφής Ψημένη Γη, Δρασκελίζει Υπέρ Νωθρού Κυνός'
return (str + '').replace(/^(.)|\s+(.)/g, function ($1) {
return $1.toUpperCase();
});
};
Eu usaria regex para este fim:
myString = ' this Is my sTring. ';
myString.trim().toLowerCase().replace(/\w\S*/g, (w) => (w.replace(/^\w/, (c) => c.toUpperCase())));
text-transform:capitalize;
.