replace() - метод для замены части строки в JavaScript

replace() заменяет часть строки на другое значение.

Метод удобен, когда нужно заменить слово, символ, шаблон по регулярному выражению или сформировать новую строку на основе найденного совпадения.

Синтаксис

str.replace(pattern, replacement)

Где:

pattern - строка или регулярное выражение
replacement - строка или функция

Метод возвращает новую строку.

Как работает replace()

const text = "Hello world";

console.log(text.replace("world", "JavaScript")); // "Hello JavaScript"

Метод не меняет исходную строку, а возвращает новый результат.

Исходная строка не меняется

Строки в JavaScript неизменяемы, поэтому replace() не изменяет исходное значение.

const text = "Hello world";
const result = text.replace("world", "JS");

console.log(text);   // "Hello world"
console.log(result); // "Hello JS"

Замена только первого совпадения

Если в первом аргументе передана обычная строка, replace() заменит только первое совпадение.

const text = "ha ha ha";

console.log(text.replace("ha", "ho")); // "ho ha ha"

То же самое произойдёт и с регулярным выражением без флага g.

const text = "ha ha ha";

console.log(text.replace(/ha/, "ho")); // "ho ha ha"

Как заменить все совпадения

Если нужно заменить все совпадения через replace(), обычно используют регулярное выражение с флагом g.

const text = "ha ha ha";

console.log(text.replace(/ha/g, "ho")); // "ho ho ho"

replace() со строкой и regex

replace() умеет работать не только с обычной строкой, но и с регулярным выражением.

const text = "Order #123";

console.log(text.replace(/\d+/, "999")); // "Order #999"

Это удобно, когда замена зависит не от точного текста, а от шаблона.

replace() с функцией

Во втором аргументе можно передать не только строку, но и функцию.

const text = "price: 10";

const result = text.replace(/\d+/, (match) => String(Number(match) * 2));

console.log(result); // "price: 20"

Это полезно, когда новое значение нужно вычислить.

Когда это полезно

replace() удобно использовать, когда:

нужно заменить часть строки
нужно сделать замену по шаблону
новое значение зависит от найденного совпадения

Пример:

const phone = "8 (999) 123-45-67";
const cleaned = phone.replace(/\D/g, "");

console.log(cleaned); // "89991234567"

replace() и replaceAll()

replace() без глобального regex заменяет только первое совпадение.

const text = "ha ha ha";

console.log(text.replace("ha", "ho")); // "ho ha ha"

replaceAll() предназначен именно для замены всех совпадений.

const text = "ha ha ha";

console.log(text.replaceAll("ha", "ho")); // "ho ho ho"

Если нужен именно один заменённый фрагмент, подходит replace(). Если нужны все, часто удобнее replaceAll().

Частые ошибки

Ожидать, что replace() заменит все совпадения

const text = "ha ha ha";

console.log(text.replace("ha", "ho")); // "ho ha ha"

По умолчанию заменяется только первое совпадение.

Забывать, что исходная строка не меняется

let text = "Hello world";

text.replace("world", "JS");
console.log(text); // "Hello world"

Нужно сохранить результат:

let text = "Hello world";

text = text.replace("world", "JS");
console.log(text); // "Hello JS"

Путать строку и регулярное выражение

const text = "1 2 3";

console.log(text.replace("\\d", "x")); // "1 2 3"
console.log(text.replace(/\d/, "x"));  // "x 2 3"

Строка "\\d" - это просто текст, а /\d/ - регулярное выражение.

Быстрая памятка

replace(pattern, replacement) заменяет часть строки
метод возвращает новую строку
исходная строка не меняется
без глобального regex обычно заменяется только первое совпадение
если нужна замена всех совпадений, используют replaceAll() или regex с g

Коротко

replace() - это метод строки в JavaScript, который заменяет часть строки на другое значение. Он удобен и для простых замен, и для более гибкой работы с регулярными выражениями и функцией-заменой.