"Капитализация каждого слова в строке на JavaScript"
Быстрый ответ
Для того чтобы сделать первую букву каждого слова в строке заглавной, примените выражение .replace(/\b\w/g, c => c.toUpperCase())
:
let city = "сан франциско";
let capitalized = city.replace(/\b\w/g, c => c.toUpperCase());
// "Сан Франциско"
Разбор быстрого ответа
Начальное преобразование для согласованности
Прежде, чем превращать буквы в заглавные, важно привести всю строку к одному, нижнему регистру:
let city = "сАН ФРАНциско";
let capitalized = city.toLowerCase().replace(/\b\w/g, c => c.toUpperCase());
// "Сан Франциско"
Выразительность синтаксиса ES6
С помощью ES6 возможно использовать стрелочные функции для создания более элегантного и компактного кода:
const capitalizeWords = str => str.toLowerCase().replace(/\b\w/g, c => c.toUpperCase());
Совмещая методы split(), map() и join()
Можно разделить строку на отдельные слова, поменять первую букву каждого слова на заглавную, а затем объединить их обратно:
const capitalizeWords = str => str
.toLowerCase()
.split(' ')
.map(word => word.charAt(0).toUpperCase() + word.slice(1))
.join(' ');
Превосходство над JavaScript
Внедрение CSS
JavaScript может уступить место менеджменту регистра на уровне CSS:
.capitalize {
text-transform: capitalize;
}
Затем это свойства можно динамически применить при помощи JavaScript:
element.style.textTransform = 'capitalize';
Специфические случаи
Имена с особыми правилами
Некоторые имена и фамилии, такие как "McDonald" или "O'Connell", требуют особого подхода:
function complexCapitalization(str) {
return str.toLowerCase().replace(/(^\w|\b\w(?<!['’]\w))/g, c => c.toUpperCase());
}
Разделители, отличные от пробелов
В некоторых названиях, например "New York-Newark", используются нестандартные разделители:
const capitalizeWords = str => str
.toLowerCase()
.replace(/(^\w|\b\w|-\w)/g, c => c.toUpperCase());
Учет лингвистических особенностей
Каждый язык и культура имеют свои правила использования заглавных букв.
Производительность важна
С большими объемами данных или при частом выполнении операций производительность может упасть, поэтому выбирайте подходы разумно!
Визуализация
Если всё ещё неясно, представьте процесс как работу художника, который раскрашивает фасады домов 🏠, делая их уникально привлекательными.
Перед нами: [дом, восходящего, солнца]
Мы, как художники, добавляем яркий акцент:
Потом: [Дом, Восходящего, Солнца]
Мы делаем акцент на первую букву каждого слова:
city.split(' ').map(word => word.charAt(0).toUpperCase() + word.slice(1)).join(' ');
// Выглядит потрясающе, не так ли?
И вот перед нами замечательный квартал, оживленный заглавными буквами! 🎩🏠🏠🏠🏠🏠
Полезные материалы
- String toUpperCase() method in JavaScript – W3Schools — Усилим "громкость" верхнего регистра.
- String charAt() method in JavaScript – W3Schools — Узнайте свои символы глубже.
- String split() method in JavaScript – W3Schools — Готовы к хирургии текста?
- String replace() method in JavaScript – W3Schools — Измените и верните, и никто не заметит.
- Строки – Современный учебник JavaScript — Магия над строками в вашем ведении.
- How to make the first letter of a string uppercase in JavaScript? – Stack Overflow — Откройте для себя мощь коллективных знаний.
- String.prototype.toUpperCase() – JavaScript | MDN — Официальное руководство по использованию ВЕРХНЕГО РЕГИСТРА.