🤚🏽 🙏🏿 🐗 型付き配列 🚞 🙆🏾 🆙

WebGLの出現により、いくつかの新しいデータ型、特に型付き配列が登場しました。それらはすべて同様のインターフェースを持ち、従来のアレイの速度を大幅に上回り、境界制御を持ち、2つのメソッドと1つのプロパティのみを持っています。現時点では、間違えなければ、型付き配列はFireFoxとChromeの最新バージョンでサポートされています。

型付き配列の詳細については、仕様をご覧ください。

さて、記事では、基本の基本を検討します

型付き配列のタイプ

テーブルは仕様から盗まれる

種類	バイト単位のサイズ	説明	Cのアナログ
`Int8Array`	1	8ビット符号付き整数	`signed char`
`Uint8Array`	1	8ビット符号なし整数	`unsigned char`
`Int16Array`	2	符号付き16ビット整数	`short`
`Uint16Array`	2	16ビット符号なし整数	`unsigned short`
`Int32Array`	4	32ビット符号付き整数	`int`
`Uint32Array`	4	32ビット符号なし整数	`unsigned int`
`Float32Array`	4	32ビット浮動小数点数	`float`
`Float64Array`	8	64ビット浮動小数点数	`double`

型付き配列を作成する

型付き配列を作成するには、型名に似た名前のコンストラクターを使用する必要があります。たとえば、Uint8Arrayを検討してください。

 var ls1 = new Uint8Array(10), //      ls2 = new Uint8Array([1,2,3,4,5]); //     (  imageData    ),

配列を埋める

インデックスによる入力は、他の配列と同じように機能しますが、それらに加えて、指定されたオフセットを持つ別の配列を配列に挿入できます。

 ls1.set(ls2,3); //   -            undefined,  0.

サブ配列を取得する

さらに、配列の一部を取得できます。

 var ls3 = ls1.subarray(2,5), //{0:0, 1:1, 2:2, 3:3, 4:4} -- -    2-  5- ls4 = ls1.subarray(6); //{0:4, 1:5, 2:0, 3:0} -- -    6-

性能

型指定された値をすばやく処理するために特別に設計された単純な模擬テストを検討してください。

型付き配列を使用するオプション。

 var ls1 = new Uint8Array(320000), ls2 = new Uint8Array(320000), ls3 = new Uint8Array(320000); for(var i=0;i<319999;i++){ ls1[i] = i; ls2[i] = 32-i; } //4ms for(var i=0;i<319999;i++){ ls3[i] = ls1[i] * ls2[i]; }//15ms ls1.set(ls3.subarray(30,60),30) //11ms

 var ls1 = [], ls2 = [], ls3 = []; for(var i=0;i<319999;i++){ ls1[i] = i; ls2[i] = 32-i; } //26ms for(var i=0;i<319999;i++){ ls3[i] = ls1[i] * ls2[i]; } //19ms ls1.splice(30,30,ls3.slice(30,60)) //7ms

ご覧のとおり、型付き配列は配列の機能の点ではまだそれほど高速ではありませんが、他のすべての点でパフォーマンスにおいて従来の配列よりも優れています

更新：間違ったタイプ転送

解説で示唆されているように、 WebGLはECMA-262の型変換規則を使用します（ポイント3-WebGL仕様の型変換規則）。

 a = new Uint8Array(3); a[1] = 4; a[1] = 'asdasdsad'; a == {0:0, 1:0, 2:0}

型付き配列