Replace: примеры (JAVASCRIPT)

Использование метода replace для строк JavaScript
Раздел: Строки, Замена
replace(searchValue: string | RegExp, replaceValue: string): string

Основы метода replace() в JavaScript

Метод replace() принадлежит объекту String и предназначен для поиска и замены текста в строке. Он возвращает новую строку, где некоторые или все совпадения с шаблоном заменены на указанную замену. Исходная строка при этом не изменяется.

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

Синтаксис метода: str.replace(searchValue, newValue | replacerFunction).

Первый аргумент (searchValue) может быть строкой или регулярным выражением (RegExp). Если это строка, будет заменено только первое найденное вхождение. Для глобальной замены используется регулярное выражение с флагом g.

Второй аргумент (newValue) может быть строкой или функцией. Строка замены может содержать специальные паттерны: $$ (вставляет "$"), $& (вставляет всё найденное совпадение), $` (вставляет часть строки до совпадения), $' (вставляет часть строки после совпадения), $n или $<name> (вставляет n-ную или именованную группу из RegExp).

Если второй аргумент функция (replacerFunction), она выполняется для каждого совпадения. Функция принимает аргументы: match (найденная подстрока), p1, p2, ... (группы из RegExp), offset (индекс начала совпадения), string (исходная строка). Результат функции становится заменой.

Возвращаемое значение — новая строка с выполненными заменами.

Простые примеры использования

Замена первого вхождения строки:

let str = 'Собака лает, собака бежит.';
let result = str.replace('собака', 'кошка');
console.log(result);
Собака лает, кошка бежит. // Регистр важен

Глобальная замена с использованием RegExp и флага i (игнорировать регистр):

let str = 'Собака лает, собака бежит.';
let result = str.replace(/собака/gi, 'кошка');
console.log(result);
кошка лает, кошка бежит.

Использование специальных паттернов в строке замены:

let str = 'Цена: 100 руб.';
let result = str.replace(/(\d+)/, '$& USD');
console.log(result);
Цена: 100 USD руб.

Замена с использованием функции:

let str = '5 яблок и 12 апельсинов';
let result = str.replace(/\d+/g, (match) => match * 2);
console.log(result);
10 яблок и 24 апельсинов

Похожие методы в JavaScript

replaceAll() (появился в ES2021). Заменяет все вхождения подстроки, принимая первым аргументом строку или регулярное выражение с флагом g. Удобен для простой глобальной замены без необходимости явно указывать флаг в RegExp.

'aaa'.replaceAll('a', 'b'); // 'bbb'

split() и join(). Комбинация может имитировать глобальную замену, разбивая строку по разделителю и объединяя с новым значением. Подходит для замены простых строк, но менее эффективна для сложных шаблонов.

'hello world'.split('o').join('a'); // 'hella warld'

Методы регулярных выражений, такие как String.prototype.match() или RegExp.prototype.exec(), используются для поиска, но не для замены. Для комплексной обработки с заменой replace() с функцией-заменителем часто является оптимальным выбором.

Частые ошибки при применении

Ожидание глобальной замены при передаче строки в первый аргумент. Без RegExp с флагом g заменяется только первое совпадение.

let str = 'aaaa';
console.log(str.replace('a', 'b')); // 'baaa', а не 'bbbb'

Неправильное использование специальных паттернов в строке замены, когда первый аргумент — строка. Они работают только с RegExp.

console.log('100'.replace('0', '$&')); // "1$&0"
console.log('100'.replace(/0/, '$&')); // "100" ($& вставляет совпадение '0')

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

let original = 'текст';
let newStr = original.replace('текст', 'новый');
console.log(original); // 'текст' (без изменений)
console.log(newStr);   // 'новый'

Использование незаэкранированных специальных символов в RegExp при динамическом создании шаблона.

let userInput = '.'; // Точка в RegExp означает любой символ
let str = 'abc';
console.log(str.replace(new RegExp(userInput, 'g'), '!')); // '!!!' (заменит всё)

Изменения в новых версиях ECMAScript

В ES2021 (ECMAScript 2021) был представлен метод replaceAll(), который решает распространённую проблему глобальной замены при передаче строки в качестве шаблона поиска.

До его появления для глобальной замены подстроки необходимо было использовать регулярное выражение с флагом g, что требовало экранирования специальных символов RegExp.

// ES5 и выше: работающий, но неочевидный способ
let str = 'a+b+c';
let resultOld = str.replace(/\+/g, ' '); // 'a b c'
// ES2021: более ясный и безопасный способ
let resultNew = str.replaceAll('+', ' '); // 'a b c'

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

Расширенные примеры замены

Использование именованных групп захвата и функции для замены:

Пример javascript
let dateStr = '2025-12-31';
let result = dateStr.replace(
  /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/,
  (...args) => {
    let groups = args.pop(); // Объект с группами
    return `${groups.day}.${groups.month}.${groups.year}`;
  }
);
console.log(result);
31.12.2025

Динамическое изменение регистра с помощью функции:

Пример javascript
let text = 'javascript функция REPLACE';
let result = text.replace(/[а-яa-z]+/gi, (match) => {
  return match.charAt(0).toUpperCase() + match.slice(1).toLowerCase();
});
console.log(result);
Javascript Функция Replace

Экранирование HTML-специальных символов:

Пример javascript
function escapeHTML(str) {
  const map = { '&': '&', '<': '<', '>': '>', '"': '"', "'": ''' };
  return str.replace(/[&<>"']/g, (ch) => map[ch]);
}
console.log(escapeHTML('
"test"
'));
<div>"test"</div>

Замена с использованием внешних данных через замыкание в функции-заменителе:

Пример javascript
let dict = { 'яблоко': 'apple', 'груша': 'pear' };
let str = 'яблоко и груша';
let result = str.replace(/\b(яблоко|груша)\b/g, (match) => dict[match]);
console.log(result);
apple и pear

Рекурсивная замена для выравнивания вложенных скобок:

Пример javascript
let str = 'текст (внутри (ещё скобки)) конец';
while (/ \([^()]*\) /.test(str)) {
  str = str.replace(/ \([^()]*\) /g, ' [...] ');
}
console.log(str);
текст [...] конец

Аналоги в других языках программирования

PHP: Функции str_replace() и preg_replace(). Первая работает с простыми строками, вторая — с регулярными выражениями. Они могут принимать массивы для поиска и замены.

echo str_replace('мир', 'PHP', 'Привет, мир!'); // Привет, PHP!
echo preg_replace('/\d+/', '100', 'Цена 50'); // Цена 100

Python: Метод строки str.replace() и функция re.sub() из модуля re. Метод replace() по умолчанию заменяет все вхождения.

text = 'hello world'
print(text.replace('o', 'a'))  # hella warld
import re
print(re.sub(r'\d+', '100', 'Цена 50')) # Цена 100

MySQL: Функция REPLACE() работает с простыми строками и заменяет все вхождения.

SELECT REPLACE('mysql sql', 'sql', 'SQL'); -- mySQL SQL

C: Стандартная библиотека C не имеет прямой аналогии. Обычно используют функции strstr() для поиска и ручное копирование с заменой в цикле или функции из библиотек вроде strreplace() (нестандартная).

JS replace function comments

En
Replace Returns a new string with some or all matches of a pattern replaced by a replacement