文字列(String)をUint8Arrayに変換(エンコード)する方法

この記事では、Encoding APIを使って文字列をUint8Arrayに変換する方法について、

  • TextEncoder.encode()メソッドで文字列をUint8Arrayに変換する方法
    • TextEncoderコンストラクターについて
    • Uint8Arrayを16進数の文字列に変換する方法
    • Uint8Arrayのバイトサイズを求める方法

などをプログラム例を用いて分かりやすく説明するように心掛けています。ご参考になれば幸いです。

TextEncoder.encode()メソッドで文字列をUint8Arrayに変換する

TextEncoder.encode()メソッドを使用することで、文字列をUint8Arrayに変換(エンコード)することができます。

TextEncoder.encode()メソッドは、引数にエンコードする文字列を取り、Uint8Arrayに引数で与えられた文字列がUTF-8でエンコードされたものが入ったものを返します。

TextEncoder.encode()メソッドの構文を以下に示します。

TextEncoder.encode()メソッドの構文

TextEncoder.encode(string): Uint8Array
  • 引数
    • エンコードしたい文字列(string)
  • 戻り値
    • Uint8Arrayオブジェクト

以下にTextEncoder.encode()メソッドを用いたプログラム例を示します。

// エンコードする文字列を用意
const str = 'あ';

// TextEncoderオブジェクトを生成
const encoder = new TextEncoder(); // 現在TextEncoderはUTF-8エンコーディングのみをサポートしている。

// エンコードする文字列(str)をUTF-8でエンコードした結果をUint8Arrayで返す
const uint8Array = encoder.encode(str);
console.log(uint8Array); // Uint8Array(3) [ 227, 129, 130 ]

あわせて読みたい

『TextDecoder.decode()メソッドでUint8Arrayを文字列に変換(デコード)する方法』については下記の記事で詳しく説明しています。興味のある方は下記のリンクからぜひチェックをしてみてください。

Uint8Arrayを文字列(String)に変換(デコード)する方法
Uint8Arrayを文字列(String)に変換(デコード)する方法

続きを見る

TextEncoderコンストラクターについて

TextEncoderコンストラクターは、UTF-8エンコーディングのバイトストリームを扱う新しいTextEncoderオブジェクトを生成します。以前は、第一引数に文字コード(例: utf-8, utf-16, utf-16le, utf-16be)を指定することができましたが、現在の仕様では、どのような引数を与えても、生成されるオブジェクトのエンコーディングはutf-8に固定されています。

以下の例では、どのような引数をTextEncoderコンストラクターに与えても、同じ結果({ encoding: 'utf-8' })が返されます。

const encoder01 = new TextEncoder();
console.log(encoder01); // { encoding: 'utf-8' }

const encoder02 = new TextEncoder('utf-8');
console.log(encoder02); // { encoding: 'utf-8' }

const encoder03 = new TextEncoder('utf-16');
console.log(encoder03); // { encoding: 'utf-8' }　← 以前はTextEncoder {encoding: "utf-16le"}になった

const encoder04 = new TextEncoder('utf-16le');
console.log(encoder04); // { encoding: 'utf-8' } ← 以前はTextEncoder {encoding: "utf-16le"}になった

const encoder05 = new TextEncoder('utf-16be');
console.log(encoder05); // { encoding: 'utf-8' } ← 以前はTextEncoder {encoding: "utf-16be"}になった

Uint8Arrayを16進数の文字列に変換する方法

先ほどのプログラムでは、Uint8ArrayにはUTF-8でエンコードされたものが入ったものが入っていました。ここでは、Uint8Arrayの内容を16進数の文字列に変換する方法を以下に示します。

// 文字列をUint8Arrayに変換(エンコード)
const str = 'あ';
const encoder = new TextEncoder();
uint8Array = encoder.encode(str); 
console.log(uint8Array); // Uint8Array(3) [ 227, 129, 130 ]

// Uint8Arrayを16進数に変換する
const hexArray = Array.from(uint8Array)
  .map((byte) => byte.toString(16).padStart(2, '0'));
console.log(hexArray); // [ 'e3', '81', '82' ]

// 配列にしない場合
const hexString = Array.from(uint8Array)
  .map((byte) => byte.toString(16).padStart(2, '0'))
  .join('');
console.log(hexString); // "e38182"

上記のプログラムの流れを以下に説明します。

  • Array.from(arr)を使って、Uint8Arrayを通常の配列に変換する。
  • map()メソッドを使って、配列の各バイトを16進数の文字列に変換する。
  • byte.toString(16)を使って、バイト値を16進数の文字列に変換する。
  • padStart(2, '0')を使って、1桁の場合には前に0を追加して2桁にする。
  • join('')を使って、16進数の文字列の配列を連結して1つの文字列にする。

Uint8Arrayのバイトサイズを求める方法

Uint8ArrayのインスタンスのbyteLengthプロパティを用いることで、Uint8Arrayのバイトサイズを調べることができます。

以下にbyteLengthプロパティを用いたプログラム例を示します。

const str = 'あ';
const encoder = new TextEncoder();
uint8Array = encoder.encode(str); // Uint8Array(3) [ 227, 129, 130 ]

// バイトサイズを調べる
byteLength = uint8Array.byteLength;
console.log(byteLength); // 3

本記事のまとめ

この記事では、Encoding APIを使って文字列をUint8Arrayに変換する方法について、以下の内容を説明しました。

  • TextEncoder.encode()メソッドで文字列をUint8Arrayに変換する方法
    • TextEncoderコンストラクターについて
    • Uint8Arrayを16進数の文字列に変換する方法
    • Uint8Arrayのバイトサイズを求める方法

お読み頂きありがとうございました。