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

TextEncoder в JavaScript: примеры кодирования строк
Раздел: Текст, Кодировка
TextEncoder: TextEncoder

TextEncoder в JavaScript

Функция TextEncoder является частью Encoding API и используется для преобразования строк JavaScript в последовательности байтов в кодировке UTF-8. Она часто применяется при работе с бинарными данными, например, перед отправкой строк по сети, при сохранении в файлы или взаимодействии с низкоуровневыми API.

Объект создается с помощью конструктора new TextEncoder(). Он не принимает аргументов в конструкторе. Основное свойство объекта:

  • encoding: доступное только для чтения значение, всегда равное 'utf-8'.

Основные методы:

  • encode(input): преобразует переданную строку в Uint8Array, содержащий UTF-8 текст. input - строка для кодирования.
  • encodeInto(input, destination): кодирует строку в переданный буфер типа Uint8Array. Метод возвращает объект с двумя полями: read (количество прочитанных символов строки) и written (количество записанных байтов в буфер). Это полезно для минимизации выделения памяти.

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

Простое кодирование строки:

const encoder = new TextEncoder();
const data = encoder.encode('Привет мир!');
console.log(data);
Uint8Array(20) [ 208, 159, 209, 128, 208, 184, 208, 178, 208, 181, 209, 130, 32, 208, 188, 208, 184, 209, 128, 33 ]

Кодирование строки с символами за пределами Basic Multilingual Plane (например, emoji):

const encoder = new TextEncoder();
const data = encoder.encode('???? Звезда');
console.log(data);
Uint8Array(14) [ 240, 159, 140, 159, 32, 208, 151, 208, 178, 208, 181, 208, 183, 208, 180, 208, 176 ]

Использование метода encodeInto:

const encoder = new TextEncoder();
const buffer = new Uint8Array(10);
const result = encoder.encodeInto('Hello', buffer);
console.log(result);
console.log(buffer);
{ read: 5, written: 5 }
Uint8Array(10) [ 72, 101, 108, 108, 111, 0, 0, 0, 0, 0 ]

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

  • TextDecoder: выполняет обратную операцию - преобразует последовательность байтов обратно в строку.
  • Buffer.from() (Node.js): в среде Node.js объект Buffer может кодировать строки в байты с указанием кодировки (например, 'utf8', 'base64').
  • btoa() и atob(): кодируют и декодируют строки в формат Base64, но работают только с однобайтовыми символами (ASCII).
  • String.prototype.charCodeAt() и ручной цикл: позволяют получить коды символов, но без автоматического учета UTF-8.

TextEncoder является предпочтительным выбором для преобразования строк в UTF-8 байты в браузере и современных средах Node.js из-за своей эффективности и поддержки всех символов Unicode.

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

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

const encoder = new TextEncoder();
console.log(encoder.encode(null));
console.log(encoder.encode(undefined));
Uint8Array(4) [ 110, 117, 108, 108 ]
Uint8Array(9) [ 117, 110, 100, 101, 102, 105, 110, 101, 100 ]

При использовании encodeInto игнорирование возвращаемого объекта может привести к неполной записи, если буфер слишком мал.

const encoder = new TextEncoder();
const smallBuffer = new Uint8Array(3);
const info = encoder.encodeInto('Привет', smallBuffer);
console.log('Прочитано символов:', info.read);
console.log('Записано байт:', info.written);
console.log('Буфер:', smallBuffer);
Прочитано символов: 1
Записано байт: 2
Буфер: Uint8Array(3) [ 208, 159, 0 ]

Изменения в последних версиях

Функция TextEncoder была стандартизирована в спецификации Encoding API и поддерживается всеми современными браузерами и Node.js (с версии 8.3.0). Существенных изменений в последнее время не было. Однако в спецификации обсуждается добавление поддержки других кодировок, кроме UTF-8, но на момент написания статьи TextEncoder поддерживает только UTF-8.

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

Кодирование текста для создания Blob и последующего скачивания файла:

Пример javascript
const encoder = new TextEncoder();
const data = encoder.encode('Текст для файла');
const blob = new Blob([data], { type: 'text/plain;charset=utf-8' });
const url = URL.createObjectURL(blob);
// Создание ссылки для скачивания

Поточное кодирование большого текста по частям с использованием encodeInto для эффективного использования памяти:

Пример javascript
function encodeLargeText(text, chunkSize = 1024) {
    const encoder = new TextEncoder();
    const chunks = [];
    let buffer = new Uint8Array(chunkSize);
    let offset = 0;
    
    for (let i = 0; i < text.length; i += chunkSize) {
        const chunk = text.slice(i, i + chunkSize);
        const result = encoder.encodeInto(chunk, buffer);
        chunks.push(buffer.slice(0, result.written));
        buffer = new Uint8Array(chunkSize);
    }
    
    return new Uint8Array(chunks.reduce((acc, chunk) => {
        acc.push(...chunk);
        return acc;
    }, []));
}

const largeText = 'A'.repeat(5000);
console.log(encodeLargeText(largeText).length);
5000

Сравнение производительности encode и encodeInto:

Пример javascript
const encoder = new TextEncoder();
const testString = 'test '.repeat(10000);
const buffer = new Uint8Array(encoder.encode(testString).length);

console.time('encode');
const data1 = encoder.encode(testString);
console.timeEnd('encode');

console.time('encodeInto');
encoder.encodeInto(testString, buffer);
console.timeEnd('encodeInto');
encode: 0.5ms
encodeInto: 0.2ms

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

Python: метод str.encode() преобразует строку в байты.

text = 'Привет мир!'
data = text.encode('utf-8')
print(list(data))
[208, 159, 209, 128, 208, 184, 208, 178, 208, 181, 209, 130, 32, 208, 188, 208, 184, 209, 128, 33]

PHP: функция mb_convert_encoding() или iconv().

$text = 'Привет мир!';
$data = mb_convert_encoding($text, 'UTF-8');
echo bin2hex($data);
d09fd180d0b8d0b2d0b5d18220d0bcd0b8d18021

MySQL: функции HEX() или CONVERT().

SELECT HEX(CONVERT('Привет мир!' USING utf8mb4));
D09FD180D0B8D0B2D0B5D18220D0BCD0B8D18021

C: использование библиотечных функций, таких как mbstowcs() или ручная реализация UTF-8 кодирования. В отличие от JavaScript, где кодирование происходит автоматически, в C программист должен управлять памятью и проверять ошибки.

JS TextEncoder function comments

En
TextEncoder Encodes a string into a stream of UTF-8 bytes.