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 비트 길이가 큰 부호 없는 정수 0/264

설명

타입화된 배열은 배열이 아닙니다.

타입화된 배열에서 isArray()은 false를 반환합니다.

타입화된 배열은 많은 배열 메서드(예: push와 pop)을 지원하지 않습니다.

타입화된 배열은 메모리에서 이진 데이터를 저장하는 비슷한 배열 객체입니다.

Typed Array 메서드 및 속성

메서드 / 속성 설명
BYTES_PER_ELEMENT 한 요소를 저장하는 데 필요한 바이트 수를 계산하는 속성입니다.
fill() 모든 요소를 하나의 값으로 채웁니다.
find() 조건을 만족하는 첫 번째 요소를 반환합니다.
이름 타입화된 배열의 이름을 반환합니다.
of() 배열로 타입화된 배열을 생성합니다.
some() 요소가 조건을 만족하면 true를 반환합니다.

Uint8Array과 Uint8ClampedArray 비교

Uint8Array와 Uint8ClampedArray 간의 차이는 값을 추가하는 방식에 있습니다.

Uint8ClampedArray의 한 요소를 0-255 범위 외의 값으로 설정하면 기본적으로 0 또는 255으로 설정됩니다.

타입화된 배열은 값의 앞 8비트만 가져옵니다.

타입화된 배열의 장점

타입화된 배열은 C에서 작업하는 배열처럼 원시 데이터를 처리하는 방법을 제공합니다.

타입화된 배열은 원시 메모리이므로, JavaScript는 데이터를 다른 표현 형식으로 변환하지 않고 직접 어떤 함수에도 전달할 수 있습니다.

타입화된 배열은 일반 배열보다 훨씬 빠르며, 원시 이진 데이터를 사용할 수 있는 함수에 데이터를 전달하는 데 사용됩니다(컴퓨터 게임, WebGL, Canvas, 파일 API, 미디어 API).

브라우저 API는 타입화된 배열을 지원합니다

Fetch API 인스턴스

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

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;

브라우저 지원

typedArray ESCMAScript6 (ES6) 기능입니다.

모든 현대 브라우저는 ES6 (JavaScript 2015)을 지원합니다.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Yes Yes Yes Yes Yes

Internet Explorer 11( 및 이전 버전)는 지원하지 않습니다 typedArray。