JavaScript「JavaScript の型付き配列」要点まとめ
そもそも何？
- **Typed Arrays（型付き配列）**は、
「メモリ上の生データ（バイナリ）を型付きで扱うための仕組み」。
- 画像・音声・ネットワークなど、高速で大量のデータ処理をするときに使う。
構造（2つのパーツ）
| 名前 | 役割 | 例 |
|---|
| ArrayBuffer | メモリ上の「生データの箱」 | new ArrayBuffer(16) |
| TypedArray / DataView | その箱を「どう読むか」を決める窓 | new Uint8Array(buffer)、new DataView(buffer) |
→ バッファ（箱）＋ビュー（窓） の組み合わせで使う。
TypedArray の主な種類
| 型 | バイト数 | 範囲・用途 |
|---|
Int8Array | 1 | -128～127 |
Uint8Array | 1 | 0～255 |
Uint8ClampedArray | 1 | 0～255（値が自動で丸められる。画像処理用） |
Int16Array / Uint16Array | 2 | 16ビット整数 |
Int32Array / Uint32Array | 4 | 32ビット整数 |
Float32Array / Float64Array | 4 / 8 | 小数点あり（音声・座標など） |
使い方の例
// 8バイトの箱（バッファ）を作成
const buffer = new ArrayBuffer(8);
// その箱を 1バイトずつ読むビューを作る
const view = new Uint8Array(buffer);
view[0] = 255;
console.log(view[0]); // → 255
JavaScript普通の配列との違い
| 比較項目 | 普通の配列 (Array) | 型付き配列 (TypedArray) |
|---|
| 要素の型 | 何でもOK | 1種類に固定 |
| サイズ | 可変（pushできる） | 固定（変更不可） |
| 速度 | 遅め | 高速（メモリ上で連続） |
| メモリ構造 | バラバラ | 連続領域（ネイティブ風） |
| 用途 | 一般的なデータ処理 | バイナリ・画像・音声など高速処理 |
DataView とは
DataView は TypedArray よりさらに低レベル。- バイト単位で好きな場所を読み書きでき、エンディアン（バイト順）も指定可能。
const dv = new DataView(new ArrayBuffer(4));
dv.setUint16(0, 0x1234, true); // リトルエンディアンで書く
console.log(dv.getUint16(0, true)); // → 0x1234
JavaScriptよく使う場面
- Canvas のピクセルデータ操作（画像処理）
- 音声データの波形処理
- WebSocket やファイルのバイナリデータ解析
- WebAssembly とのデータ共有
注意点
- 長さは変更できない（再作成が必要）。
- エンディアンに注意（
DataViewで制御）。
Array.isArray(typedArray) → false になる。
一言まとめ
Typed Arrays は、「高速で正確にバイナリデータを扱うための特別な配列」
→ 普通の配列より低レベルだけど、画像・音声・ゲーム開発には欠かせない。
