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

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

  • TextDecoder.decode()メソッドでUint8Arrayを文字列に変換する方法
    • TextDecoderコンストラクターについて

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

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

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

TextDecoder.decode()メソッドは、引数にUint8Arrayを取り、デコードした結果を文字列(String)で返します。

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

TextDecoder.decode()メソッドの構文

TextDecoder.decode(Uint8Array): string
  • 引数
    • デコードするためのUint8Arrayオブジェクト
  • 戻り値
    • デコードした結果の文字列(string)

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

// デコードするUint8Arrayを用意
const uint8Array = new Uint8Array([227, 129, 130]);
console.log(uint8Array); // Uint8Array(3) [ 227, 129, 130 ]

// TextDecoderオブジェクトを生成
const decoder = new TextDecoder(); // TextDecoderはデフォルトでUTF-8をデコードする。

// デコードした結果を文字列で返す
const str = decoder.decode(uint8Array);
console.log(str); // あ

あわせて読みたい

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

Uint8Arrayオブジェクトの作成方法

Uint8Arrayオブジェクトは以下のどの方法でも作成できます。

// new演算子を用いた場合
const uint8Array01 = new Uint8Array([227, 129, 130]);
console.log(uint8Array01); // Uint8Array(3) [ 227, 129, 130 ]

// ofを用いた場合
const uint8Array02 = Uint8Array.of(227, 129, 130);
console.log(uint8Array02); // Uint8Array(3) [ 227, 129, 130 ]

// スプレッド演算子を用いて、Uint8Array.ofに配列を渡すこともできる
const uint8Array03 = Uint8Array.of(...[227, 129, 130]);
console.log(uint8Array03); // Uint8Array(3) [ 227, 129, 130 ]

// fromを用いた場合
const uint8Array04 = Uint8Array.from([227, 129, 130]);
console.log(uint8Array04); // Uint8Array(3) [ 227, 129, 130 ]

// 16進数でもOK
const uint8Array05 = new Uint8Array([0xe3, 0x81, 0x82]);
console.log(uint8Array05); // Uint8Array(3) [ 227, 129, 130 ]

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

TextDecoderコンストラクターは、引数にTextDecoder.decode()メソッドでデコードする文字コードを指定します。そのため、文字コードは事前にしっておく必要があります。デフォルトはutf-8なので、引数を省略した場合、utf-8が採用されます。

以下の例では、引数に異なるエンコーディング(例: utf-8, utf-16, utf-16le, utf-16be等)を指定した場合のTextDecoderオブジェクトの振る舞いを示しています。異なるエンコーディングを指定すると、TextDecoderオブジェクトのencodingプロパティがそのエンコーディングを反映します。これにより、さまざまなエンコーディング形式のバイトデータを適切にデコードすることができます。

const decoder01 = new TextDecoder();
console.log(decoder01); // { encoding: 'utf-8', fatal: false, ignoreBOM: false }

const decoder02 = new TextDecoder('utf-8');
console.log(decoder02); // { encoding: 'utf-8', fatal: false, ignoreBOM: false }

const decoder03 = new TextDecoder('utf-16');
console.log(decoder03); // { encoding: 'utf-16le', fatal: false, ignoreBOM: false }

const decoder04 = new TextDecoder('utf-16le');
console.log(decoder04); // { encoding: 'utf-16le', fatal: false, ignoreBOM: false }

const decoder05 = new TextDecoder('utf-16be');
console.log(decoder05); // { encoding: 'utf-16be', fatal: false, ignoreBOM: false }

const decoder06 = new TextDecoder('iso-8859-2');
console.log(decoder06); // { encoding: 'iso-8859-2', fatal: false, ignoreBOM: false }

一例として、utf-16le と utf-16be のエンコーディングを使用して、TextDecoder でデコードするプログラム例を以下に示します。

utf-16leの場合

// デコードするUint8Arrayを用意 (「あ」のutf-16leエンコーディング)
const uint8Array_le = new Uint8Array([0x42, 0x30]);
console.log(uint8Array_le); // Uint8Array(2) [ 66, 48 ]

// TextDecoderオブジェクトを生成 (utf-16le用)
const decoder_le = new TextDecoder('utf-16le');

// デコードした結果を文字列で返す
const str_le = decoder_le.decode(uint8Array_le);
console.log(str_le); // あ

utf-16beの場合

// デコードするUint8Arrayを用意 (「あ」のutf-16beエンコーディング)
const uint8Array_be = new Uint8Array([0x30, 0x42]);
console.log(uint8Array_be); // Uint8Array(2) [ 48, 66 ]

// TextDecoderオブジェクトを生成 (utf-16be用)
const decoder_be = new TextDecoder('utf-16be');

// デコードした結果を文字列で返す
const str_be = decoder_be.decode(uint8Array_be);
console.log(str_be); // あ

本記事のまとめ

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

  • TextDecoder.decode()メソッドでUint8Arrayを文字列に変換する方法
    • TextDecoderコンストラクターについて

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