バイナリ配列ArayBuffer

3045 ワード

概要
インターフェース設計の本来の目的は、WebGLプロジェクトと関連があります.WebGLとは、ブラウザとグラフィックスカードとの間の通信インターフェースを指し、Javascriptとグラフィックスカードとの間の大量のデータ、リアルタイムのデータ交換を満たすために、彼らの間の通信はバイナリでなければならず、伝統的なテキストフォーマットではない.

ArayBufferオブジェクトは、元のバイナリデータ

を表す.

TypedArayは、単純タイプのバイナリデータを読み書きするために使用される

DataViewは、複雑なタイプのバイナリデータを読み書きするために用いられる

.
ブラウザを操作するAPIが知られています.バイナリ配列を使用したものがあります.

File API

XMLtpRequest

Fetch API

Canvas

Websocket

ArayBuffer対象
図は指定されたフォーマットでバイナリデータArayBufferを解読する役割を果たし、データを格納する連続メモリ空間を割り当てることができます.

var buf = new ArrayBuffer(32); //32

ArayBuffer.prototype.byteLength

は、割り当てられたメモリ領域のバイト長

を返す.

var buffer = new ArrayBuffer(32);
console.info(buffer.byteLength); //32

ArayBuffer.prototype.slice()

により、メモリ領域の一部を新たなArayBufferオブジェクト

にコピーすることができます.

var buffer = new Arraybuffer(8);
var newBuffer = buffer.slice(0,3); //         ，

Araybouffer.isView()

静的方法isViewは、パラメータがArayBufferであるかどうかを示すブックレン値を返します.

var buffer = new ArrayBuffer(8);
ArrayBuffer.isView(buffer); //false

var v = new Int32Array(buffer);
ArrayBuffer.isView(v); //true

TypedArayビュー

構成関数のセットは、異なるデータフォーマット

を表しています.

Int 8 Aray 8ビット有符号len=1

Uint 8 Aray 8ビット符号なしlen=1

Unit 8 ClampedAray 8ビット符号なし整数、len=1、オーバーフロー処理が異なる

Int 16 Aray 16ビット有符号len=2

Uint 16 Aray 16ビット符号なしlen=2

Int 32 Aray(buffer)32桁は符号len=4

があります.

UnityAray;32ビット符号なしlen=4

Float 32 Aray 32ビット浮動小数点len=4

Float 64 Aray 64ビット浮動小数点len=8

構造方式

TypedAray(buffer、byteOffset、length?)

var b = new ArrayBuffer(8);
var v1 = new Int32Array(b);

var v2 = new Unit8Array(b, 2);

var v3 = new Int16Array(b, 2, 2);

TypedAray

var abcd = new Float64Array(8);
abcd[0] = 10;

TypedAray

var typedArray = new Int8Array(new Unit8Array(8));

TypedAray

var typeArray = new Unit8Array([1,2,3,4,5]);

複合ビュー

は、ビューの構造関数が開始位置と長さを指定できるので、同じセグメントのメモリにおいて、異なるタイプのデータ

を順次保存することができる.

var buffer = new ArrayBuffer(24);

var idView = new Int32Array(buffer, 0, 1);
var nameVidw = new Int32Array(buffer, 4, 1);
var ageVidw = new Int32Array(buffer, 8, 1);

DataViewビュー

DataViewビュー自体も構造関数であり、ArayBufferオブジェクトをパラメータとして受け入れ、ビューを生成する

   DataView(ArrayBuffer buffer[,        [,   ]])

大端バイト順読み出しは、小端バイト順読み出しとは異なる.デフォルトは、大端バイト順読み出しデータ

です.

dvd.getUint 16(1,true)//小端

dvd.getUint 16(3,false)/大端

バイナリ配列の適用
ajax、canvas、file、websocket、fetch

var canvas = document.getElmentById('myCanvas');
var ctx = canvas.getContext('2d');

var imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
var uint8ClampedArray = imageData.data;

uint8ClampedArray         ，            8   ，     0~255，
                 ;    255，     255，   0     0

webpack loaderのロード順序(右から左、下から上)