Как сделать первую букву строки заглавной в JavaScript?

Question

Как сделать первую букву строки заглавной, но не изменить регистр других букв?

Например:

• "this is a test" -> "This is a test"
• "the Eiffel Tower" -> "The Eiffel Tower"
• "/index.html" -> "/index.html"

Answer 1

function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1);
}

Некоторые другие ответы изменяют String.prototype (этот ответ также использовался), но я бы посоветовал не делать этого сейчас из-за удобства обслуживания (сложно определить, где функция добавляется в prototype и может вызвать конфликты, если другой код использует то же имя / браузер добавляет в будущем встроенную функцию с тем же именем).

Answer 2

Вот более объектно-ориентированный подход:

String.prototype.capitalize = function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
}

Вы бы вызвали функцию следующим образом:

"hello world".capitalize();

с ожидаемым результатом:

"Hello world" 

Answer 3

В CSS:

p:first-letter {
    text-transform:capitalize;
}

Answer 4

Вот сокращенная версия популярного ответа, который получает первую букву, обрабатывая строку как массив:

function capitalize(s)
{
    return s[0].toUpperCase() + s.slice(1);
}

Обновление:

Согласно комментариям ниже, это не работает в IE 7 или ниже.

Обновление 2:

Чтобы избежать undefined для пустых строк (см. Комментарий @ njzk2 ниже ), вы можете проверить наличие пустой строки:

function capitalize(s)
{
    return s && s[0].toUpperCase() + s.slice(1);
}

Answer 5

Вот лучшие решения:

Первое решение В CSS:

p {
  text-transform: capitalize;
}

Второй раствор :

function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1).toLowerCase();
}

Вы также можете добавить его в String.prototype, чтобы связать его другими методами:

String.prototype.capitalizeFirstLetter = function() {
    return this.charAt(0).toUpperCase() + this.slice(1).toLowerCase();
}

и используйте его так:

'string'.capitalizeFirstLetter() // String

Третье решение :

function ucFirstAllWords( str )
{
    var pieces = str.split(" ");
    for ( var i = 0; i < pieces.length; i++ )
    {
        var j = pieces[i].charAt(0).toUpperCase();
        pieces[i] = j + pieces[i].substr(1).toLowerCase();
    }
    return pieces.join(" ");
}

Answer 6

Если вы заинтересованы в исполнении нескольких различных опубликованных методов:

Вот самые быстрые методы на основе этого теста jsperf (упорядочены от самого быстрого до самого медленного).

Как видите, первые два метода по существу сопоставимы с точки зрения производительности, тогда как изменение String.prototype является самым медленным с точки зрения производительности.

// 10,889,187 operations/sec
function capitalizeFirstLetter(string) {
    return string[0].toUpperCase() + string.slice(1);
}

// 10,875,535 operations/sec
function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1);
}

// 4,632,536 operations/sec
function capitalizeFirstLetter(string) {
    return string.replace(/^./, string[0].toUpperCase());
}

// 1,977,828 operations/sec
String.prototype.capitalizeFirstLetter = function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
}

Answer 7

В другом случае мне нужно, чтобы первая буква была заглавной, а остальные строчными. Следующие случаи заставили меня изменить эту функцию:

//es5
function capitalize(string) {
    return string.charAt(0).toUpperCase() + string.slice(1).toLowerCase();
}
capitalize("alfredo")  // => "Alfredo"
capitalize("Alejandro")// => "Alejandro
capitalize("ALBERTO")  // => "Alberto"
capitalize("ArMaNdO")  // => "Armando"

// es6 using destructuring 
const capitalize = ([first,...rest]) => first.toUpperCase() + rest.join('').toLowerCase();

Answer 8

Это решение ECMAScript 6+ 2018 года :

const str = 'the Eiffel Tower';
const newStr = `${str[0].toUpperCase()}${str.slice(1)}`;
console.log('Original String:', str); // the Eiffel Tower
console.log('New String:', newStr); // The Eiffel Tower

Answer 9

var string = "hello world";
string = string.charAt(0).toUpperCase() + string.slice(1);
alert(string);

Answer 10

Прописать первую букву всех слов в строке:

function ucFirstAllWords( str )
{
    var pieces = str.split(" ");
    for ( var i = 0; i < pieces.length; i++ )
    {
        var j = pieces[i].charAt(0).toUpperCase();
        pieces[i] = j + pieces[i].substr(1);
    }
    return pieces.join(" ");
}