JavaScript にバイト配列を格納する

1. JavaScript の ArrayBuffer オブジェクト
2. 型付き配列ビュー
3. JavaScript で型付き配列ビューを使用して ArrayBuffer を操作する

この記事では、JavaScript でバイト配列を格納する方法について説明します。

JavaScript の ArrayBuffer オブジェクト

バイト配列またはバイト配列は、JavaScript では ArrayBuffer オブジェクト として知られています。 ArrayBuffer は JavaScript 配列から派生したものではなく、変更できないメモリ内の固定長を持ちます。

さらに、通常の JavaScript 配列で行うように、ArrayBuffer オブジェクトの要素に直接アクセスすることはできません。 読み取り/書き込みには別のビュー オブジェクトが必要です。

構文：

new ArrayBuffer(length_in_bytes);

上記のコードは ArrayBuffer コンストラクターを呼び出して、指定されたバイト長で新しい ArrayBuffer インスタンスを作成します。

長さ 8 バイトの ArrayBuuffer を作成しましょう。

let myTypedArrayBuffer = new ArrayBuffer(8);

理想的には、上記のコードは、サイズが 8 バイトの新しい ArrayBuffer を作成する必要があります。 ここで、作成された ArrayBuffer オブジェクト myTypedArrayBuffer の byteLength プロパティを確認します。

コード：

console.log(myTypedArrayBuffer.byteLength);

出力：

予想どおり、バッファーの長さは 8 バイトです。 各バイトがゼロに割り当てられているメモリに8バイトを割り当てます。

このバッファは、そのバイトを操作するメカニズムを提供しません。 したがって、型付き配列ビュー オブジェクトを使用して、ArrayBuffer を読み書きする必要があります。

型付き配列ビュー

型付き配列ビューは、バイト配列、特にメモリに格納された ArrayBuffer の説明を提供するさまざまなレンズのようなものです。 これらのビューは、符号付きおよび符号なしの整数や浮動小数点などの数値型をサポートしています。

ArrayBuffer オブジェクトを操作するために、次のビューが実装されています。

ご覧のとおり、異なるビューを使用すると、ArrayBuffer 内のバイナリ データを異なる数値形式として解釈できます。

JavaScript で型付き配列ビューを使用して ArrayBuffer を操作する

上記の型付き配列ビューはすべて、次に示す同じコンストラクター パターンに従います。

new TypedArray(buffer);              // provides and ArrayBuffer type object
new TypedArray(array_object);        // provides an array-like object
new TypedArray(number_of_elements);  // provides the number of integers to be in
                                     // the typed array
new TypedArray(another_typed_array);  // provides and ArrayBuffer type object
new TypedArray();

JavaScript には実際の TypedArray() コンストラクターはありません。 new Uint8Array(), new Float64Array() のようなビュー コンストラクターの 1つになります。

前の例から、新しい Uint8Array ビューを作成して、既に作成された ArrayBuffer(myTypedArrayBuffer) を操作しましょう。

コード：

let unsigned8BitIntView = new Uint8Array(myTypedArrayBuffer);
console.log(unsigned8BitIntView);

出力：

Uint8Array 型付き配列オブジェクトは、すべてのバイトが値 0 で埋められて作成されました。

このビュー オブジェクトの長さと実際のバイト長を調べてみましょう。 両方とも 8 である必要があります。

コード：

console.log(
    'Length of the view: ' + unsigned8BitIntView.length +
    '.... Byte length of the view: ' + unsigned8BitIntView.byteLength);

上記の 2つの値を取得するために、Uint8Array ビューで length および byteLength プロパティを使用しました。

出力：

メモリ バッファに値を書き込みましょう。

unsigned8BitIntView[0] = 200;

これで、各要素を反復して unsigned8BitIntView オブジェクトを調べることができます。

コード：

for (let value of unsigned8BitIntView) {
  console.log(value);
}

出力：

200 の値がバイト配列に格納されています。 300 をバイト配列に書き込んでみましょう。

unsigned8BitIntView[1] = 300;

上記の例のように、バイト配列をもう一度繰り返します。

出力：

出力によると、整数 300 はバイト配列に書き込まれていません。これは、このビューが 0 から 255 の範囲の整数しか書き込めないためです。

300 は無視され、代わりに 44 と書かれます。 以下は、整数 44 がどのように生成されるかを示しています。

整数 300 は、バイナリ形式で次のように記述できます。

100101100

このビューは 8 ビットの符号なし整数を解釈するため、最初のビットは省略され、残りの 8 ビットが考慮されます。

00101100

上記のバイナリ形式は整数 44 です。 同様に、すべての型付き配列ビューを使用して、基になる ArrayBuffer またはメモリ内のバイト配列を操作できます。