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

Правильное решение: комбинация charAt/toUpperCase и slice

Ваша проблема решается очень просто — нужно взять первый символ, сделать его заглавным, а затем добавить к нему остальную часть строки. Для этого отлично подходит метод slice().

Вот самый распространённый и надёжный способ:

function capitalizeFirstLetter(str) {
    if (!str) return str; // Защита от пустой строки
    return str.charAt(0).toUpperCase() + str.slice(1);
}

// Примеры использования:
console.log(capitalizeFirstLetter("hello world")); // "Hello world"
console.log(capitalizeFirstLetter("javaScript"));  // "JavaScript"
console.log(capitalizeFirstLetter(""));            // ""
console.log(capitalizeFirstLetter("a"));           // "A"

Как это работает

• str.charAt(0) — получает первый символ строки (аналог str[0], но безопаснее для старых браузеров)
• .toUpperCase() — преобразует этот символ в верхний регистр
• str.slice(1) — возвращает часть строки, начиная с индекса 1 (то есть всё, кроме первого символа)
• Оператор + — объединяет заглавную букву с остальной строкой

Почему это лучший способ?

• Простота и читаемость — код понятен даже новичку
• Надёжность — работает с пустыми строками и строками из одного символа
• Поддержка Unicode — корректно работает с кириллицей, латиницей и другими алфавитами
• Производительность — не создаёт лишних массивов или циклов

Альтернатива с квадратными скобками

В современном JavaScript (ES5+) можно использовать синтаксис с квадратными скобками вместо charAt():

const capitalizeFirstLetter = (str) => 
    str ? str[0].toUpperCase() + str.slice(1) : '';

Важные нюансы

1. Пустая строка. Если строка пустая, str[0] вернёт undefined, и вызов toUpperCase() вызовет ошибку. Поэтому всегда проверяйте наличие строки.

2. Строки с пробелами в начале. Если строка начинается с пробела, этот метод сделает заглавным пробел, что не имеет смысла. Для таких случаев сначала используйте trim():

function capitalizeTrimmed(str) {
    return str.trim() ? str.trim()[0].toUpperCase() + str.trim().slice(1) : '';
}

3. Многоязычные строки. Метод toUpperCase() корректно работает с Unicode, включая русские буквы. Например:

console.log(capitalizeFirstLetter("привет мир")); // "Привет мир"
console.log(capitalizeFirstLetter("über cool"));  // "Über cool"

Что делать, если нужно сделать заглавной каждую букву?

Если ваша задача — сделать заглавной первую букву каждого слова (Title Case), используйте комбинацию с split() и map():

function titleCase(str) {
    return str.split(' ').map(word => 
        word ? word[0].toUpperCase() + word.slice(1) : ''
    ).join(' ');
}

console.log(titleCase("hello world")); // "Hello World"

Этот подход разбивает строку на массив слов, преобразует каждое слово и собирает обратно в строку.

function capitalizeRegex(str) {
    return str.replace(/^./, char => char.toUpperCase());
}

console.log(capitalizeRegex("hello"));     // "Hello"
console.log(capitalizeRegex("123abc"));    // "123abc" (не меняет, т.к. первый символ — цифра)
console.log(capitalizeRegex(""));          // "" (пустая строка)