String.raw: примеры (JAVASCRIPT)

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

Пример 1: Базовое использование с шаблонным литералом.

const result = String.raw`Hello\nWorld`;
console.log(result);

Hello\nWorld

Пример 2: Сравнение с обычным шаблонным литералом.

console.log(`Hello\nWorld`); // С переводом строки
console.log(String.raw`Hello\nWorld`); // Без перевода строки

Hello
World
Hello\nWorld

Пример 3: Использование с подстановками.

const name = 'Alex';
const path = String.raw`C:\Users\${name}\Documents`;
console.log(path);

C:\Users\Alex\Documents

Пример 4: Использование с функциональной формой (редко).

const result = String.raw({ raw: ['Hi ', '!'] }, 'Bob');
console.log(result);

Hi Bob!

Похожие функции в JavaScript

1. Шаблонные литералы (обратные кавычки)
Позволяют встраивать выражения и многострочные строки, но преобразуют escape-последовательности. Используются, когда нужна интерполяция или многострочность без сохранения символов как есть.

console.log(`Строка с\nпереводом строки.`);

Строка с
переводом строки.

2. Метод String.prototype.replace() с регулярными выражениями
Может эмулировать частичную функциональность для экранирования символов, но менее удобен для обработки шаблонов целиком. Применяется для точечной замены в существующих строках.

const str = `C:\test\new`;
const rawLike = str.replace(/\n/g, '\\n').replace(/\t/g, '\\t');
console.log(rawLike);

C:\test\new

Выбор метода: String.raw предпочтителен при создании новых строк из шаблонов, где обратные слеши должны оставаться видимыми. Обычные шаблонные литералы используются для всех остальных случаев интерполяции. Методы замены подходят для модификации уже существующих строковых данных.

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

Python: "сырые" строки (raw strings)
В Python строки с префиксом 'r' не обрабатывают escape-последовательности. Отличие в том, что это синтаксис строки, а не функция.

normal_str = "Hello\nWorld"
raw_str = r"Hello\nWorld"
print(normal_str)
print(raw_str)

Hello
World
Hello\nWorld

PHP: Функция addslashes() и nowdoc
addslashes() экранирует специальные символы. Синтаксис nowdoc (<<<'EOT') аналогичен сырым строкам, не производит подстановку переменных.

$str = "O'Reilly\nBook";
echo addslashes($str); // Экранирует кавычки и слеши
// Nowdoc
$raw = <<<'TAG'
Путь: C:\Users\Name
TAG;
echo $raw;

O\'Reilly\nBook
Путь: C:\Users\Name

C#: Буквальные строки (verbatim strings)
Используется префикс @ перед строкой. Escape-последовательности (кроме "" для кавычки) не обрабатываются.

string normal = "Hello\nWorld";
string raw = @"Hello\nWorld";
Console.WriteLine(normal);
Console.WriteLine(raw);

Hello
World
Hello\nWorld

MySQL: Функция QUOTE()
Экранирует специальные символы для безопасного использования в SQL-запросах, что является более узкой задачей.

SELECT QUOTE('O\'Reilly\nData');

'O\'Reilly\nData'

Типичные ошибки

Ошибка 1: Попытка использовать String.raw на обычной строке (не шаблонном литерале).

// Неправильно:
const wrong = String.raw("Hello\nWorld");
console.log(wrong);

TypeError: Cannot convert undefined or null to object

Ошибка 2: Непонимание, что String.raw не экранирует кавычки внутри шаблона.

const str = String.raw`Он сказал: "Привет"`;
console.log(str); // Кавычки остаются, как есть
// Для включения обратного слеша перед кавычкой его нужно удвоить в шаблоне
const str2 = String.raw`Он сказал: \"Привет\"`;
console.log(str2);

Он сказал: "Привет"
Он сказал: \"Привет\"

Ошибка 3: Ожидание, что String.raw как-то защитит от XSS или санирует ввод. Это не его задача.

const userInput = `<script>alert('xss')</script>`;
const page = String.raw`<div>${userInput}</div>`;
// userInput будет вставлен как есть, без экранирования.
console.log(page);

<div><script>alert('xss')</script></div>

История изменений

Метод String.raw был представлен в стандарте ECMAScript 2015 (ES6) и с тех пор его спецификация остается стабильной. Не было значительных изменений в его поведении или синтаксисе в последующих версиях ECMAScript (ES2016-ES2023).

Основные детали реализации, такие как обработка первого аргумента как объекта с массивом raw, были четко определены с самого начала и поддерживаются во всех современных браузерах и средах выполнения JavaScript (Node.js).

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

Пример 1: Генерация регулярного выражения с динамической частью.

const ext = 'js';
const regexPattern = String.raw`^\w+\.${ext}$`;
const regex = new RegExp(regexPattern);
console.log(regexPattern);
console.log(regex.test("file.js")); // true
console.log(regex.test("file\n.js")); // false (\n в имени файла)

^\w+\.js$
true
false

Пример 2: Создание строки с "сырыми" символами Unicode.

const unicodeRaw = String.raw`\u{41}\u{42}\u{43}`;
const unicodeNormal = `\u{41}\u{42}\u{43}`;
console.log(unicodeRaw); // Символы не преобразованы
console.log(unicodeNormal); // Символы преобразованы в ABC

\u{41}\u{42}\u{43}
ABC

Пример 3: Многострочные "сырые" строки с отступами.

const query = String.raw`
    SELECT * 
    FROM users 
    WHERE name LIKE '%%O\'Reilly%%'
`;
console.log(query);

    SELECT * 
    FROM users 
    WHERE name LIKE '%%O\'Reilly%%'

Пример 4: Эмуляция String.raw через функциональную форму для динамических шаблонов.

function createRawTemplate(strings, ...values) {
    // Ручная сборка, аналогичная String.raw
    let result = '';
    for (let i = 0; i < values.length; i++) {
        result += strings.raw[i]; // Используем raw-версии строк!
        result += values[i];
    }
    result += strings.raw[strings.length - 1];
    return result;
}
const name = 'file';
const path = createRawTemplate`C:\test\${name}.txt`;
console.log(path);

C:\test\file.txt

Пример 5: Комбинация String.raw с другими теговыми функциями.

function upperRaw(strings, ...values) {
    // Сначала получаем "сырую" строку через String.raw
    let rawResult = String.raw(strings, ...values);
    // Затем применяем преобразование
    return rawResult.toUpperCase();
}
const res = upperRaw`Hello\n${'World'}!`;
console.log(res);

HELLO\NWORLD!