JavaScript | Как убрать экранирующие обратные слеши с символами юникода из строки, которая является частью синтаксиса языка?

JavaScript | Как убрать экранирующие обратные слеши с символами юникода из строки, которая является частью синтаксиса языка?

Мы хотим преобразовать JavaScript-строку таким образом, чтобы полностью избавиться от экранирующих обратных слешей. Здесь точно не нужно городить цепочки из методов replace() или replaceAll(). Не переживайте, решение уже давно придумано и оно уже давно работает в браузере. Согласитесь, если браузер понимает как преобразовывать экранные JS-строки, значит вам об этом думать не нужно. Вам нужно просто знать какой класс в JavaScript и какой его метод умеет решать подобные задачи.

Обратные слеши не живут сами по себе в строке. Они обязательно экранируют какой-то символ справа от себя. То есть первый встречный обратный слеш должен быть частью  синтаксиса JS, который будет экранировать другой обратный слеш (как часть обычного символа строки), … либо будет экранировать символ юникода. Кого-то он в любом случае экранирует. Но количество последовательных обратных слешей имеет значение.

Посмотрите на эти адреса, которые мы получили из ответа сервера, сканируя сайт интернет-магазина:

Экранирующие обратные слеши в URL-адресах из ответа сервера - JavaScript
Экранирующие обратные слеши в URL-адресах из ответа сервера — JavaScript

 

Большинство ссылок летят не в классическом виде HTML-разметки, а внутри HTML-элементов script. Технически в этом нет ничего незаконного. Это просто часть реализации. Видимо по каким-то причинам разработчикам проще отправлять инструкции для браузера, а не писать алгоритм подготовки строки HTML-разметки. Имеют право.

Получается, что внутри самого HTML-элемента script очень много объектов с ключами и значениями, которые потом трансформируются в HTML-разметку при помощи JavaScript и сил браузера (клиента).

Как же нам правильно и быстро конвертировать в НОРМАЛЬНЫЙ вид эти URL-адреса?

 

Решение

За адекватную конвертацию строк отвечает класс JSON, который является встроенным по умолчанию в язык JavaScript.

У конструктора этого класса есть метод, позволяющий преобразовать строку к НОРМАЛЬНОМУ виду.

25.5 The JSON Object - ECMAScript menu - 2022
25.5 The JSON Object — ECMAScript menu — 2022

Этот метод называется parse().

 

Давайте поглядим на примеры:

JSON.parse(`\"https:\\u002F\\u002Fcdn1.ozone.ru\\u002Fs3\\u002Fmultimedia-m\\u002F6281461522.jpg\"`)
'https://cdn1.ozone.ru/s3/multimedia-m/6281461522.jpg'
JSON.parse() заменил экранные обратные слеши и юникоды на нормальные символы - JavaScript - 2022
JSON.parse() заменил экранные обратные слеши и юникоды на нормальные символы — JavaScript — 2022

 

Если просто пытаться парсить разное количество обратных слешей, то будут такие результаты

JSON.parse() и несколько вариантов с обратными слешами - JavaScript - 2022
JSON.parse() и несколько вариантов с обратными слешами — JavaScript — 2022

 

Информационные ссылки

Стандарт ECMAScript — Раздел «25.5 The JSON Object» — https://tc39.es/ecma262/multipage/structured-data.html#sec-json-object