Как кодировать/декодировать UTF-8 в JavaScript

UTF-8 означает « Формат преобразования Unicode 8-битный » и соответствует отличному формату кодирования, который гарантирует правильное отображение символов на всех устройствах, независимо от используемого языка/скрипта. Кроме того, этот формат удобен для веб-страниц и используется для хранения, обработки и передачи текстовых данных в Интернете.

В этом руководстве рассматриваются указанные ниже области содержания:

• Что такое кодировка UTF-8?
• Как работает кодировка UTF-8?
• Как вычисляются значения кодовых точек?
• Как кодировать/декодировать UTF-8 в JavaScript?
• Кодируйте/декодируйте UTF-8 в JavaScript с помощью методов «encodeURIComponent()» и «decodeURIComponent()».
• Кодируйте/декодируйте UTF-8 в JavaScript с помощью методов «encodeURI()» и «decodeURI()».
• Кодируйте/декодируйте UTF-8 в JavaScript с помощью регулярных выражений.
• Заключение

Что такое кодировка UTF-8?

« Кодировка UTF-8 » — это процедура преобразования последовательности символов Юникода в закодированную строку, содержащую 8-битные байты. Эта кодировка может представлять более широкий диапазон символов по сравнению с другими кодировками символов.

Как работает кодировка UTF-8?

При представлении символов в UTF-8 каждая отдельная кодовая точка представлена ​​одним или несколькими байтами. Ниже приводится разбивка кодовых точек в диапазоне ASCII:

• Один байт представляет кодовые точки в диапазоне ASCII (0–127).
• Два байта представляют собой кодовые точки в диапазоне ASCII (128–2047).
• Три байта представляют собой кодовые точки в диапазоне ASCII (2048–65535).
• Четыре байта представляют собой кодовые точки в диапазоне ASCII (65536–1114111).

Это так, что первый байт « UTF-8 последовательность называется « ведущий байт », который дает информацию о количестве байтов в последовательности и значении кодовой точки символа.
«Лидерский байт» для последовательности одиночных, двух, трех и четырех байтов находится в диапазоне (0–127), (194–233), (224–239) и (240–247) соответственно.

Остальные байты в последовательности называются « тянущийся » байт. Все байты двух-, трех- и четырехбайтовой последовательности находятся в диапазоне (128–191). Это так, что значение кодовой точки символа можно вычислить путем анализа начального и конечного байтов.

Как вычисляются значения кодовых точек?

Значения кодовых точек для различных последовательностей байтов рассчитываются следующим образом:

• Двухбайтовая последовательность: Кодовая точка эквивалентна «((lb – 194) * 64) + (tb – 128)».
• Трехбайтовая последовательность : Кодовая точка эквивалентна «((lb – 224) * 4096) + ((tb1 – 128) * 64) + (tb2 – 128)».
• Четырехбайтовая последовательность : Кодовая точка эквивалентна «((lb – 240) * 262144) + ((tb1 – 128) * 4096) + ((tb2 – 128) * 64) + (tb3 – 128)».

Как кодировать/декодировать UTF-8 в JavaScript?

Кодирование и декодирование UTF-8 в JavaScript может осуществляться с помощью следующих подходов:

• « енодеURIКомпонент() ' и ' декодироватьURIКомпонент() Методы.
• « кодироватьURI() ' и ' декодироватьURI() Методы.
• Обычные выражения.

Подход 1. Кодирование/декодирование UTF-8 в JavaScript с использованием методов encodeURIComponent() и decodeURIComponent().

« кодироватьURIКомпонент() ” кодирует компонент URI. Кроме того, он может кодировать специальные символы, такие как @, &, :, +, $, # и т. д. декодироватьURIКомпонент() Однако метод декодирует компонент URI. Эти методы можно использовать для кодирования и декодирования переданных значений в UTF-8 соответственно.

Синтаксис (метод «encodeURIComponent()»)

В данном синтаксисе « Икс » указывает URI, который нужно закодировать.

Возвращаемое значение
Этот метод получил закодированный URI в виде строки.

Синтаксис (метод «decodeURIComponent()»)

Здесь, ' Икс «» относится к URI, который необходимо декодировать.

Возвращаемое значение
Этот метод дает декодированный URI.

Пример 1. Кодировка UTF-8 в JavaScript
В этом примере переданная строка кодируется в закодированное значение UTF-8 с помощью пользовательской функции:

В этих строках кода выполните следующие шаги:

• Сначала определим функцию « кодировать_utf8() », который кодирует переданную строку, представленную указанным параметром.
• Это кодирование выполняется командой « кодироватьURIКомпонент() ” в определении функции.
• Примечание: « unescape() ” заменяет любую escape-последовательность представленным ею символом.
• После этого инициализируйте значение, которое нужно закодировать, и отобразите его.
• Теперь вызовите определенную функцию и передайте определенную комбинацию символов в качестве ее аргументов, чтобы закодировать это значение в UTF-8.

Выход

Здесь можно подразумевать, что отдельные символы представлены и закодированы в UTF-8 соответственно.

Пример 2: Декодирование UTF-8 в JavaScript
Демонстрация кода ниже декодирует переданное значение (в виде символов) в закодированное представление UTF-8:

В этом блоке кода:

• Аналогично определим функцию « декодировать_utf8() », который декодирует переданную комбинацию символов через « декодироватьURIКомпонент() метод.
• Примечание: « побег() Метод ” извлекает новую строку, в которой различные символы заменены шестнадцатеричными escape-последовательностями.
• После этого укажите комбинацию символов для декодирования и получите доступ к определенной функции, чтобы правильно выполнить декодирование в UTF-8.

Выход

Здесь можно подразумевать, что закодированное значение в предыдущем примере декодируется до значения по умолчанию.

Подход 2. Кодирование/декодирование UTF-8 в JavaScript с использованием методов encodeURI() и decodeURI().

« кодироватьURI() ” кодирует URI, заменяя каждый экземпляр нескольких символов рядом escape-последовательностей, представляющих кодировку UTF-8 символа. По сравнению с « кодироватьURIКомпонент() », этот конкретный метод кодирует ограниченное количество символов.

« декодироватьURI() Однако метод декодирует URI (закодированный). Эти методы можно реализовать в комбинации для кодирования и декодирования комбинации символов в значении в кодировке UTF-8.

Синтаксис (метод encodeURI())

В приведенном выше синтаксисе: « Икс » соответствует значению, которое должно быть закодировано как URI.

Возвращаемое значение
Этот метод извлекает закодированное значение в виде строки.

Синтаксис (метод decodeURI())

Здесь, ' Икс » представляет закодированный URI, который необходимо декодировать.

Возвращаемое значение
Он возвращает декодированный URI в виде строки.

Пример 1. Кодировка UTF-8 в JavaScript
В этой демонстрации переданная комбинация символов кодируется в закодированное значение UTF-8:

Здесь вспомним подходы к определению функции, выделенной для кодирования. Теперь примените метод «encodeURI()», чтобы представить переданную комбинацию символов в виде строки в кодировке UTF-8. После этого аналогичным образом определите символы, которые будут оцениваться, и вызовите определенную функцию, передав определенное значение в качестве ее аргументов для выполнения кодирования.

Выход

Здесь видно, что переданная комбинация символов закодирована успешно.

Пример 2: Декодирование UTF-8 в JavaScript
Демонстрация кода ниже декодирует закодированное значение UTF-8 (в предыдущем примере):

Согласно этому коду объявите функцию « декодировать_utf8() », который содержит указанный параметр, представляющий комбинацию символов, подлежащих декодированию с использованием « декодироватьURI() метод. Теперь укажите значение, которое необходимо декодировать, и вызовите определенную функцию, чтобы применить декодирование к « UTF-8 ' представление.

Выход

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

Подход 3. Кодирование/декодирование UTF-8 в JavaScript с использованием регулярных выражений

В этом подходе применяется такое кодирование, при котором многобайтовая строка Юникода кодируется в несколько однобайтовых символов UTF-8. Аналогичным образом декодирование выполняется таким образом, что закодированная строка декодируется обратно в многобайтовые символы Юникода.

Пример 1: Кодировка UTF-8 в JavaScript
В приведенном ниже коде многобайтовая строка Юникода кодируется в однобайтовые символы UTF-8:

В этом фрагменте кода:

• Определим функцию « кодироватьUTF8() », содержащий параметр, который представляет значение, которое должно быть закодировано как « UTF-8 ».
• В его определении примените проверку к переданному значению, которое не является строкой, используя « тип » и вернуть указанное пользовательское исключение через « бросать ключевое слово.
• После этого примените « charCodeAt() ' и ' изCharCode() ” для получения Юникода первого символа в строке и преобразования данного значения Юникода в символы соответственно.
• Наконец, вызовите определенную функцию, передав заданную последовательность символов, чтобы закодировать это значение как « UTF-8 ' представление.

Выход

Этот вывод означает, что кодирование выполнено правильно.

Пример 2: Декодирование UTF-8 в JavaScript
В этой демонстрации последовательность символов декодируется как « UTF-8 ' представление:

В этом коде:

• Аналогично определим функцию « декодироватьUTF8() », имеющий параметр, который относится к передаваемому значению, подлежащему декодированию.
• В определении функции проверьте строковое условие переданного значения с помощью параметра « тип » оператор.
• Теперь примените « charCodeAt() ” для получения символов Юникода первой, второй и третьей строки соответственно.
• Также примените « String.fromCharCode() ” для преобразования значений Юникода в символы.
• Аналогичным образом повторите эту процедуру еще раз, чтобы получить символы Юникода первого и второго строк и преобразовать эти значения Юникода в символы.
• Наконец, обратитесь к определенной функции, чтобы вернуть декодированное значение UTF-8.

Выход

Здесь можно убедиться, что декодирование выполнено правильно.

Заключение

Кодирование/декодирование в представлении UTF-8 можно выполнить с помощью команды « енодеURIКомпонент()» и ' декодироватьURIКомпонент() методы, « кодироватьURI() ' и ' декодироватьURI() ” или с помощью регулярных выражений.