Если это для отображения, используйте CSS. text-transform:capitalize;,
Kennytm
3
это должно использоваться для установки атрибута "title" для элементов DOM. нет CSS :)
vsync
1
Кроме того, я задал этот вопрос, хотя и знаю решение, просто потому, что пытался найти его на этом сайте и не смог найти достойного решения, поэтому добавил его для документации.
вс
1
@KennyTM: text-transform в действительности не будет использовать заглавные буквы форм, все значения будут представлены заглавными буквами, но будут отправлены на сервер как есть.
Марко Демайо
8
@ Марко: Да, именно поэтому я сказал: «Если это для отображения».
Kennytm
Ответы:
287
/**
* 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());;
regexp работает так: «Возьмите все непробельные символы (\ S), стоящие справа в начале строки (^) или после любого пробельного символа (\ s), и
введите
3
Небольшое улучшение для обработки строк в верхнем регистре :) ** String.prototype.capitalize = function () {вернуть this.toLowerCase (). Replace (/ (?: ^ | \ S) \ S / g, function (a) {return a.toUpperCase ();}); }; **
SuryaPavan
1
Пожалуйста, не изменяйте прототипы существующих объектов.
Ашерер
1
@ Dr.X см дополнение, 'CHECK THIS OUT'.capitalize(true) -> "Check This Out". trueПараметр разума .
расстроен
1
@ SeaWarrior404, вы правы, обновили мой ответ синтаксисом es6, добавили jsdoc и некоторые знаки препинания
расстроен
216
Кратчайшая реализация заглавных слов в строке - это использование функций стрелок ES6:
'your string'.replace(/\b\w/g, l => l.toUpperCase())// => 'Your String'
Регулярное выражение в основном соответствует первой букве каждого слова в данной строке и преобразует только эту букву в верхний регистр:
\ b соответствует границе слова (начало или конец слова);
\ w соответствует следующему метасимволу [a-zA-Z0-9].
Для не-ASCII символов обратитесь к этому решению вместо
'ÿöur striñg'.replace(/(^|\s)\S/g, l => l.toUpperCase())
Это регулярное выражение соответствует первой букве и каждой непробельной букве, которой предшествует пробел в данной строке, и преобразует только эту букву в верхний регистр:
(x | y) соответствует любой из указанных альтернатив
Неконтролирующая группа могла бы использоваться здесь следующим образом /(?:^|\s)\S/g хотя gфлаг в нашем регулярном выражении не будет захватывать подгруппы в любом случае.
Не могли бы вы объяснить в ответе, как работает регулярное выражение? (смысл каждого куска)
vsync
2
Я выберу его как ответ, если объяснение будет внутри, а не как комментарий, который можно пропустить.
vsync
2
Похоже, это не работает для нордических символов ä, ö и å. Например päijät-hämeстановитсяPäIjäT-HäMe
Маркус Месканен
1
Это решение не подходит для международного контента, содержащего диакритические / нелатинские символы. EisbäRenэто один из результатов, например.
Даниэль Б.
3
Пример из @MarkusMeskanen должен измениться на Päijät-Häme, но по крайней мере в пробелах Chrome нет тире (-), поэтому вторая часть имени не пишется с заглавной буквы. Можно исправить как /(^|\s|-)\S/g.
MiRin
34
function capitalize(s){return s.toLowerCase().replace(/\b./g,function(a){return a.toUpperCase();});};
capitalize('this IS THE wOrst string eVeR');
Я не знаю причину, но очевидно, что \bв регулярном выражении совпадают также буквы с акцентом (проверено на IE8 и Chrome), поэтому строка вроде "località"бы будет неправильно преобразована в заглавную"LocalitÀ" ( àбуква становится заглавной, потому что регулярное выражение считает, что это граница слова)
Более общая функция, которая работает также с акцентированными буквами :
Поскольку все дали вам ответ на вопрос JavaScript, который вы просили, я добавлю, что свойство CSS text-transform: capitalizeсделает именно это.
Я понимаю, что это может быть не тем, о чем вы просите - вы не дали нам никакого контекста, в котором вы это используете, - но если бы это было только для презентации, я бы определенно выбрал альтернативу CSS.
KennyTM опередил вас. Проверьте его комментарий в разделе вопросов. :-)
Бухаке Синди
Да, я знаю этот атрибут CSS, но он мне нужен для атрибута title для элементов dom, и у него нет CSS, как вы, возможно, знаете.
vsync
4
Джон Резиг (из известной компании jQuery) перенес сценарий Perl, написанный Джоном Грубером, в JavaScript. Этот сценарий использует заглавные буквы более интеллектуальным способом, он не использует заглавные слова, например, «of» и «and».
<formname="form1"method="post"><inputname="instring"type="text"value="this is the text string"size="30"><inputtype="button"name="Capitalize"value="Capitalize >>" onclick="form1.outstring.value=form1.instring.value.capitalize();">
<inputname="outstring"type="text"value=""size="30"></form>
Я не являюсь поклонником прототипирования таким способом, потому что мои сценарии иногда являются сторонними встраиваниями на других сайтах, и это может вызвать проблемы при работе с глобальным объектом, таким как "String" ... поэтому я предпочитаю вместо этого "функционировать".
Вс
1
В этом прелесть прототипа (не тот, который вы скачали). Это стандарт в javascript и работает во всех браузерах.
Бухаке Синди
Я подозреваю, что это может вызвать проблемы, если кто-то уже прототипировал свой собственный String.prototype.capitalize, и я случайно переопределю его.
vsync
1
@vsync, вы всегда можете проверить это. if (object.capitalize) {...} else {String.prototype.capitalize = function()....}где объект имеет тип String. Так что все довольно просто.
Бухаке Синди
4
Ответ Иво хорош, но я предпочитаю не совпадать, \wпотому что нет необходимости использовать 0-9 и AZ. Мы можем игнорировать их и совпадать только по аз.
'your string'.replace(/\b[a-z]/g, match => match.toUpperCase())// => 'Your String'
Это тот же вывод, но я думаю, что более понятный с точки зрения самодокументируемого кода.
Это будет терпеть неудачу за не английские буквы: "Är Toaletten". Ваш ответ, спустя годы после того, как был получен очень хороший ответ, не способствует обсуждению ..
vsync
@vsync, который кажется довольно резким. это оптимизация к принятому ответу. /\b\w/gтакже не подходит для неанглийских букв. Не все имеют дело с юникодными символами, и это поможет тем, кто хочет этого не делать.
Большие деньги
1
Хорошо ... Я просто не думаю, что вы должны использовать это вместо основного ответа только потому, что вам не нужны никакие другие языки, кроме английского. Это не вполне оправданное оправдание, поскольку за все символы ASCII это не наказывается, как сказано в главном вопросе
vsync
3
Если вы используете lodash в своем приложении JavaScript, вы можете использовать _.capitalize :
Попробуйте несколько методов, и ваше решение является наиболее эффективным и учитывает акценты имени jsbench.me/urjeu9wvql
nasatome
Это не работает: 'a áAA. bb . bbb .cc .d'.toCapital();=>a Áaa. bb . Bbb .cc .d
vsync
Я сделал это, чтобы не рассматривать слова с менее чем двумя буквами, например, «из», «как».
Эрик Тацуи
1
Это должно охватывать большинство основных случаев использования.
const capitalize =(str)=>{if(typeof str !=='string'){throwError('Feed me string')}elseif(!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
Не могли бы вы объяснить, почему, по вашему мнению, ваш ответ лучше, чем у других людей много лет назад?
vsync
Можете ли вы объяснить, почему вы думаете, что я имел в виду, что мой ответ лучше / или лучше, чем другие? Я не упоминал об этом, это просто другое. Кроме того, я не видел, чтобы вы оставили этот комментарий на других постах, поэтому я действительно не понимаю. Но для начала: он использует современные функции js (деструктуризация, жирная стрелка, неявный возврат), он не использует regx, и это более функциональный подход к проблеме. Также он имеет очень простую обработку ошибок и возвращает пустую строку, если вы ее передаете (для меня это было важно).
падает
все нормально, но оно должно быть лучше или равнозначно другим ответам, и кажется, что оно ... нечитаемо и, конечно, ничего не
вставит
Аааа, хорошо, так что 50% решений здесь, какой Monkeypatch String вы фактически запустите в производство? Или, может быть, запутанные выражения регулярных выражений? С этим гораздо легче рассуждать, верно? Имхо абсолютно нет! Также сказать, что никто не поймет это довольно субъективное утверждение. Также для этого вы сказали, что это кусочек кода (больше возможностей, но здесь это не так). Как так, что это измельчено и мое решение никто не поймет? Вы не сможете распутать эти регулярные выражения, не теряя часов.
падает
Этот код был написан самим г-ном Резигом и не должен подвергаться сомнению. С другой стороны, вам не хватает доверия из-за вашей анонимности. Несмотря на это, решение Regex короче, работает намного быстрее и также легко читается любым, кто изучил основы Regex. В этом мало что можно «распутать»: /\b\w/g...
vsync
1
Это решение не использует регулярные выражения, поддерживает акцентированные символы, а также поддерживается практически каждым браузером.
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;}}
Использование:
console.log (capitalizeIt («Второй в программе Javascript»));
Этот способ потребляет много ресурсов процессора. JavaScript не изменяет примитивные значения, что подразумевает создание нового при каждом выполнении операции. Лучше использовать нативные функции, такие как «заменить», например, gratia.
Google может быть всем, что вам нужно для таких проблем.
Наивным подходом было бы разделить строку по пробелам, использовать первую букву каждого элемента результирующего массива с заглавными буквами и объединить ее вместе. Это оставляет существующую заглавную букву одной (например, HTML остается HTML и не превращается в нечто глупое, как HTML). Если вы не хотите этого эффекта, перед разделением переведите всю строку в нижний регистр.
Мне нравится идти с легким процессом. Сначала измените строку на Array для легкой итерации, затем с помощью функции map измените каждое слово так, как вы хотите.
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 или Javascipt не предоставляют встроенный метод для достижения этой цели.
Тестовое преобразование CSS (text-transform: capitalize;) на самом деле не делает заглавными данные строки, а показывает на экране заглавные буквы.
Если вы ищете более законный способ достижения этого на уровне данных с использованием простого vanillaJS, используйте это решение =>
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);}}
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();});};
text-transform:capitalize;
,Ответы:
источник
'CHECK THIS OUT'.capitalize(true) -> "Check This Out"
.true
Параметр разума .Кратчайшая реализация заглавных слов в строке - это использование функций стрелок ES6:
ES5-совместимая реализация:
Регулярное выражение в основном соответствует первой букве каждого слова в данной строке и преобразует только эту букву в верхний регистр:
Для не-ASCII символов обратитесь к этому решению вместо
Это регулярное выражение соответствует первой букве и каждой непробельной букве, которой предшествует пробел в данной строке, и преобразует только эту букву в верхний регистр:
Неконтролирующая группа могла бы использоваться здесь следующим образом
/(?:^|\s)\S/g
хотяg
флаг в нашем регулярном выражении не будет захватывать подгруппы в любом случае.Ура!
источник
päijät-häme
становитсяPäIjäT-HäMe
EisbäRen
это один из результатов, например.Päijät-Häme
, но по крайней мере в пробелах Chrome нет тире (-), поэтому вторая часть имени не пишется с заглавной буквы. Можно исправить как/(^|\s|-)\S/g
.вывод: "Это худшая строка из всех"
Обновить:
Похоже, это решение заменяет мое: https://stackoverflow.com/a/7592235/104380
источник
Ответ предоставляется VSync работает до тех пор , пока вы не акцентированные буквы в строке ввода.
Я не знаю причину, но очевидно, что
\b
в регулярном выражении совпадают также буквы с акцентом (проверено на IE8 и Chrome), поэтому строка вроде"località"
бы будет неправильно преобразована в заглавную"LocalitÀ"
(à
буква становится заглавной, потому что регулярное выражение считает, что это граница слова)Более общая функция, которая работает также с акцентированными буквами :
Вы можете использовать это так:
источник
" javascript".toCapitalize() -> " javascript"
Поскольку все дали вам ответ на вопрос JavaScript, который вы просили, я добавлю, что свойство CSS
text-transform: capitalize
сделает именно это.Я понимаю, что это может быть не тем, о чем вы просите - вы не дали нам никакого контекста, в котором вы это используете, - но если бы это было только для презентации, я бы определенно выбрал альтернативу CSS.
источник
Джон Резиг (из известной компании jQuery) перенес сценарий Perl, написанный Джоном Грубером, в JavaScript. Этот сценарий использует заглавные буквы более интеллектуальным способом, он не использует заглавные слова, например, «of» и «and».
Вы можете найти его здесь: Заголовок заглавия в JavaScript
источник
Использование JavaScript и HTML
В принципе, вы можете сделать
string.capitalize()
и он будет использовать каждую первую букву каждого слова.Источник: http://www.mediacollege.com/internet/javascript/text/case-capitalize.html
источник
if (object.capitalize) {...} else {String.prototype.capitalize = function()....}
где объект имеет типString
. Так что все довольно просто.Ответ Иво хорош, но я предпочитаю не совпадать,
\w
потому что нет необходимости использовать 0-9 и AZ. Мы можем игнорировать их и совпадать только по аз.Это тот же вывод, но я думаю, что более понятный с точки зрения самодокументируемого кода.
источник
"Är Toaletten"
. Ваш ответ, спустя годы после того, как был получен очень хороший ответ, не способствует обсуждению ../\b\w/g
также не подходит для неанглийских букв. Не все имеют дело с юникодными символами, и это поможет тем, кто хочет этого не делать.Если вы используете lodash в своем приложении JavaScript, вы можете использовать _.capitalize :
источник
Краткий ES6 способ сделать это может выглядеть примерно так.
Это только заглавные буквы первой буквы и не влияет на остальную часть предложения.
источник
Мое решение:
Пример:
источник
'a áAA. bb . bbb .cc .d'.toCapital();
=>a Áaa. bb . Bbb .cc .d
Это должно охватывать большинство основных случаев использования.
Изменить: Улучшена читаемость отображения.
источник
/\b\w/g
...Это решение не использует регулярные выражения, поддерживает акцентированные символы, а также поддерживается практически каждым браузером.
Использование:
Вывод:
источник
http://www.mediacollege.com/internet/javascript/text/case-capitalize.html - один из многих ответов.
Google может быть всем, что вам нужно для таких проблем.
Наивным подходом было бы разделить строку по пробелам, использовать первую букву каждого элемента результирующего массива с заглавными буквами и объединить ее вместе. Это оставляет существующую заглавную букву одной (например, HTML остается HTML и не превращается в нечто глупое, как HTML). Если вы не хотите этого эффекта, перед разделением переведите всю строку в нижний регистр.
источник
Этот код использует заглавные слова после точки:
источник
Мне нравится идти с легким процессом. Сначала измените строку на Array для легкой итерации, затем с помощью функции map измените каждое слово так, как вы хотите.
источник
Jquery или Javascipt не предоставляют встроенный метод для достижения этой цели.
Тестовое преобразование CSS (text-transform: capitalize;) на самом деле не делает заглавными данные строки, а показывает на экране заглавные буквы.
Если вы ищете более законный способ достижения этого на уровне данных с использованием простого vanillaJS, используйте это решение =>
источник
Использовать это:
источник
Вы можете использовать следующее для прописных слов в строке:
источник
Есть также locutus: https://locutus.io/php/strings/ucwords/, который определяет это следующим образом:
источник
Я бы использовал регулярные выражения для этой цели:
источник