Podręcznik referencyjny typizowanych tablic JavaScript

JavaScript 类型化数组

在 Javascript 中,类型化数组是二进制数据的类似数组的缓冲区。

不存在名为 TypedArray 的 JavaScript 属性或对象,但属性和方法可以与类型化数组对象一起使用:

实例

const myArr = new Int8Array(10);

亲自试一试

类型化数组的对象

对象 数据类型 范围
Int8Array 有符号整数(字节) -128/127
Uint8Array 无符号整数(八位字节) 0/255
Uint8ClampedArray 无符号整数(八位字节) 0/255
Int16Array 短整数 -32768/32767
Uint16Array 无符号短整数 0/65535
Int32Array 有符号长整数 -231/231-1
Uint32Array 无符号长整数 0/232
Float32Array 浮点 - 7 位有效数字 1.2x10-38/3.4x1038
Float64Array 双精度浮点 - 16 位有效数字 5.0x10-324/1.8x10308
BigInt64Array 有符号大整数 -263/263-1
BigUint64Array Niewyrażone duże liczby 0/264

Wyjaśnienie

Typowane tablice nie są tablicami.

isArray() na typowanych tablicach zwraca false.

Typowane tablice nie obsługują wielu metod tablic (np. push i pop).

Typowane tablice są obiektami podobnymi do tablic, używanymi do przechowywania danych binarnych w pamięci.

Metody i atrybuty Typed Array

Metoda / Atrybut Opis
BYTES_PER_ELEMENT Oblicza właściwość liczby bajtów potrzebnych do przechowania jednego elementu.
fill() Wypełnia wszystkie elementy wartością.
find() Zwraca pierwszy element spełniający warunek.
name Zwraca nazwę tablicy typowanej.
of() Tworzy typowaną tablicę z tablicy.
some() Zwraca true, jeśli element spełnia warunek.

Uint8Array w porównaniu do Uint8ClampedArray

Różnica między Uint8Array a Uint8ClampedArray polega na sposobie dodawania wartości.

Jeśli element Uint8ClampedArray zostanie ustawiony na wartość poza zakresem 0-255, domyślnie będzie ustawiony na 0 lub 255.

Typowane tablice biorą tylko pierwsze 8 bitów wartości.

Zalety typowanych tablic

Typowane tablice oferują metodę przetwarzania danych binarnych, tak efektywną jak tablice w C.

Typowane tablice są surową pamięcią, więc JavaScript może przekazywać je bezpośrednio do każdej funkcji, bez konieczności konwersji danych na inny format.

Typowane tablice są znacznie szybsze niż zwykłe tablice, służą do przekazywania danych do funkcji, które mogą używać surowych danych binarnych ( gry komputerowe, WebGL, Canvas, API plików, API mediów).

API przeglądarki obsługuje typowane tablice

Instancja Fetch API

fetch(url)
.then(request => request.arrayBuffer())
.then(arrayBuffer =>...);

Instancja Canvas

const canvas = document.getElementById('my_canvas');
const context = canvas.getContext('2d');
const imageData = context.getImageData(0, 0, canvas.width, canvas.height);
const uint8ClampedArray = imageData.data;

Wsparcie przeglądarek

typedArray To są cechy ECMAScript6 (ES6).

Wszystkie współczesne przeglądarki obsługują ES6 (JavaScript 2015).

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Tak Tak Tak Tak Tak

Internet Explorer 11 (i wcześniejsze wersje) nie obsługuje typedArray.