【JavaScript】 2バイト以上のTypedArrayバイナリ保存はエンディアンに注意

JavaScriptのDataViewまたはTypedArrayのバイナリ保存の方法について、次の記事で紹介しています。

しかし2バイト以上のTypedArrayは、エンディアンについて考慮する必要があります。

そこで今回は、上記の二つの記事の補足として、2バイト以上のTypedArrayをバイナリ出力するときの注意点についてお伝えします。

2バイト以上のTypedArrayをバイナリ出力したとき、出力されたデータはJavaScriptエンジンによって異なります。

これはエンディアンという概念によるものです。
エンディアンとは、2バイト以上のデータをメモリに格納するときの順番を既定したものです。

例えば、次のような2バイトデータがあるとします。

0x1234

ビッグエンディアンは、このデータを次の順番でメモリに格納します。

リトルエンディアンは、次のように順番が逆になります。

では、TypedArrayのエンディアンはどちらでしょうか？

答えは、不明です。
JavaScriptの言語仕様では、JavaScriptエンジンを作成するエンジニアに一任されています。
どちらかのエンディアンで固定されているかもしれませんし、CPUのエンディアンを読み取っているかもしれません。

後者の場合は、同じJavaScriptエンジンでもエンディアンが異なることになります。

以上のことから、2バイト以上のTypedArrayから作成したバイナリデータを、異なる環境間でやりとりするのは危険が伴います。

2バイト以上のTypedArrayを出力する場合、新規バッファと共にDataViewを作成して、出力データをリトルエンディアン（またはビッグエンディアン）でコピーしてから、ファイルに書き出します。

const fs = require("fs");

  // 出力したいデータ
const u16 = Uint16Array.of( 0x1122 , 0x3344 , 0x5566);

  // 出力データと同じサイズのバッファー確保
const dataView = new DataView( new ArrayBuffer( u16.byteLength ) );

 // 出力データをビッグエンディアンでコピー
u16.forEach( (val,index) =>dataView.setUint16(index * 2 , val , false));

 // 変数dataViewをバイナリ出力
fs.writeFile("./binary.dat", dataView, err => {
    if (err) throw err;
    console.log("出力しました");
});

ブラウザでのファイル出力は、【JavaScript】 ArrayBufferとTypedArray-メモリを確保してアクセスを参考にしてください。

2バイト以上のTypedArrayを読み込む場合は、上のコードと逆のことをおこないます。

const fs = require("fs");

fs.readFile("./binary.dat", (err, result) => {
    if (err) throw err;

    const u16 = new Uint16Array( result.buffer );
    const dataView = new DataView( result.buffer );
   
    for( let i = 0 ; i < u16.length ; i ++ )
        u16[i] = dataView.getUint16( i * 2 , false);

});