Работа со строками в JavaScript: полное руководство

const str = 'Привет, мир!';
console.log(str.includes('мир')); // true
console.log(str.includes('Мир')); // false (регистр)

const str = 'JavaScript - мощный язык';
const idx = str.indexOf('мощный');
console.log(idx); // 13
if (idx !== -1) {
  console.log('Подстрока найдена на позиции ' + idx);
}

const str = 'Hello, World!';
console.log(str.search(/world/i)); // 7
console.log(str.search(/mars/i));  // -1

const url = 'https://example.com';
console.log(url.startsWith('https')); // true
console.log(url.endsWith('.com'));     // true
console.log(url.startsWith('example', 8)); // true

Дополнительные примеры работы со строками

Конкатенация строк

Оператор + или метод concat().

const a = 'Hello';
const b = 'World';
console.log(a + ', ' + b + '!'); // Hello, World!
console.log(a.concat(', ', b, '!')); // Hello, World!

Hello, World!
Hello, World!

Шаблонные строки (template literals)

Вставка выражений через ${} и многострочность.

const name = 'Анна';
const age = 25;
const greeting = `Привет, ${name}! Тебе ${age} лет.`;
console.log(greeting);
const multi = `Строка
на нескольких
строках`;
console.log(multi);

Привет, Анна! Тебе 25 лет.
Строка
на нескольких
строках

Извлечение подстроки: slice, substring, substr

slice(start, end) и substring(start, end) похожи, но substring меняет местами аргументы, если start > end. substr (устаревший) использует длину.

const str = 'JavaScript';
console.log(str.slice(0, 4));   // Java
console.log(str.substring(4, 0));// Java (меняет)
console.log(str.substr(4, 6));  // Script

Java
Java
Script

Разбиение строки на массив и обратное соединение

Метод split() делит строку по разделителю. join() собирает массив в строку.

const csv = 'яблоко, груша, банан';
const arr = csv.split(', ');
console.log(arr); // ['яблоко', 'груша', 'банан']
console.log(arr.join('; ')); // яблоко; груша; банан

['яблоко', 'груша', 'банан']
яблоко; груша; банан

Удаление пробелов с краёв

trim(), trimStart(), trimEnd() удаляют пробелы и другие whitespace-символы.

const spaced = '   Hello   ';
console.log(spaced.trim());       // 'Hello'
console.log(spaced.trimStart()); // 'Hello   '
console.log(spaced.trimEnd());   // '   Hello'

Hello
Hello   
   Hello

Дополнение строки до заданной длины

padStart() и padEnd() добавляют символы слева или справа.

const hour = '9';
const minute = '5';
console.log(hour.padStart(2, '0'));    // '09'
console.log(minute.padEnd(2, '0'));    // '50'
console.log('123'.padStart(6, '*'));  // '***123'

09
50
***123

Повторение строки

Метод repeat() повторяет строку заданное количество раз.

const laugh = 'ха';
console.log(laugh.repeat(3)); // 'хахаха'
console.log('!'.repeat(5));   // '!!!!!'

хахаха
!!!!!

Изменение регистра

toUpperCase() и toLowerCase(). Для локально-зависимых преобразований: toLocaleUpperCase().

const text = 'Привет, Мир!';
console.log(text.toUpperCase()); // ПРИВЕТ, МИР!
console.log(text.toLowerCase()); // привет, мир!
const turkish = 'iI';
console.log(turkish.toLocaleUpperCase('tr')); // 'İI' (турецкая I)

ПРИВЕТ, МИР!
привет, мир!
İI

Регулярные выражения: exec и matchAll

Метод exec() возвращает совпадения с группами. matchAll() - итератор всех совпадений.

const regex = /(\d+)/g;
const str = 'Цена: 100 руб, скидка 20';
let match;
while ((match = regex.exec(str)) !== null) {
  console.log(`Найдено число: ${match[1]} на позиции ${match.index}`);
}
// Альтернатива с matchAll:
const matches = [...str.matchAll(/[а-я]+/gi)];
console.log(matches.map(m => m[0])); // ['Цена', 'руб', 'скидка']

Найдено число: 100 на позиции 6
Найдено число: 20 на позиции 23
['Цена', 'руб', 'скидка']

Сравнение строк

localeCompare() сравнивает строки с учётом локали. Возвращает -1, 0 или 1.

const a = 'éclair';
const b = 'zèbre';
console.log(a.localeCompare(b, 'fr')); // -1 (éclair идёт раньше)
console.log('a'.localeCompare('A')); // 0 или 1 в зависимости от локали

-1
0

Преобразование строки в число

parseInt, parseFloat, унарный +, Number().

const numeric = '42.5px';
console.log(parseInt(numeric));   // 42
console.log(parseFloat(numeric)); // 42.5
console.log(+'15');               // 15
console.log(Number(''));          // 0
console.log(parseInt('0xFF'));    // 255 (шестнадцатеричная)

42
42.5
15
0
255

Доступ к символам: charAt, charCodeAt, codePointAt

Для корректной работы с суррогатными парами (эмодзи) рекомендуется codePointAt().

const emoji = '?';
console.log(emoji.length);                // 2 (суррогатная пара)
console.log(emoji.charCodeAt(0));         // 55357 (0xD83D)
console.log(emoji.codePointAt(0));       // 128522 (полный код)
console.log(emoji.charAt(0));            // '\uD83D'

2
55357
128522
\uD83D

Проверка на пустую строку

Простое условие if (str) не сработает для строки из пробелов. Лучше использовать trim().

const empty = '';
const spaced = '   ';
console.log(!!empty);          // false (пустая строка - falsy)
console.log(!!spaced);         // true (пробелы - truthy)
console.log(spaced.trim() === ''); // true

false
true
true

Замена подстроки: replace и replaceAll

Метод replace() заменяет первое совпадение; с глобальным флагом - все. replaceAll() заменяет все без необходимости флага.

const sentence = 'Кот и котёнок';
console.log(sentence.replace('кот', 'пёс'));      // Кот и пёсёнок (регистр)
console.log(sentence.replace(/кот/gi, 'пёс'));    // пёс и пёсёнок
console.log(sentence.replaceAll('кот', 'пёс'));   // Кот и пёсёнок (без флага)

Кот и пёсёнок
пёс и пёсёнок
Кот и пёсёнок

Проверка начала и конца с indexOf

Альтернатива startsWith и endsWith для старых браузеров.

const str = 'Hello World';
console.log(str.indexOf('Hello') === 0); // true
console.log(str.lastIndexOf('World') === str.length - 'World'.length); // true

true
true