JavaScript Typed Arrays 类型化数组
类型化数组
类型化数组 专为处理二进制数据而设计。
与普通数组不同,类型化数组是固定长度的缓冲区。
类型化数组存储固定类型的元素,例如 8 位整数或 32 位数字。
示例
创建一个包含 5 个字节的类型化数组:
const myArr = new Uint8Array(5);亲自试一试 »
从数组创建类型化数组:
const myArr = new Uint8Array([0,1,2,3,4]);亲自试一试 »
从数字列表创建类型化数组:
const myArr = Uint8Array.of(0,1,2,3,4);亲自试一试 »
从数组创建类型化数组:
const myArr = Uint8Array.from([0,1,2,3,4]);亲自试一试 »类型化数组的优势
类型化数组旨在提供一种高效处理二进制数据的方式,这与传统的 JavaScript 数组不同,后者可以存储混合数据类型的元素。
类型化数组是原始内存,因此 JavaScript 可以直接将其传递给任何函数,而无需将数据转换为其他表示形式。
对于需要使用原始二进制数据的函数来说,类型化数组比普通数组速度快得多。类型化数组非常适合以下场景:
-
WebGL 和 Canvas:
快速图形渲染和图像处理。 -
File APIs:
快速读写本地文件。 -
Media APIs:
快速处理音频和视频数据。 -
WebSocket:
高效的网络二进制数据传输。
类型化数组是作为 ECMAScript 2015 (ES6) 规范的一部分引入 JavaScript 的,该规范于 2015 年 6 月发布。
与普通数组的区别
-
固定长度:
类型化数组不能使用 push() 或 pop() 等方法动态调整大小。 -
类型限制:
元素必须符合类型化数组指定的数据类型。 -
底层缓冲区:
类型化数组是 ArrayBuffer 的视图,允许直接操作二进制数据。
类型化数组类型
| 名称 | 最小值 | 最大值 | 字节数 | 类型 |
|---|---|---|---|---|
| Int8Array | -128 | 127 | 1 | byte |
| Uint8Array | 0 | 255 | 1 | octet |
| Uint8ClampedArray | 0 | 255 | 1 | octet |
| Int16Array | -32768 | 32767 | 2 | short |
| Uint16Array | 0 | 65535 | 2 | unsigned short |
| Int32Array | -2147483648 | 2147483647 | 4 | long |
| Uint32Array | 0 | 4294967295 | 4 | unsigned long |
| BigInt64Array | -263 | 263 - 1 | 8 | bigint |
| BigUint64Array | 0 | 264 - 1 | 8 | unsigned bigint |
| Float16Array | -65504 | 65504 | 2 | unrestricted half |
| Float32Array | -3.4e38 | 3.4e38 | 4 | unrestricted float |
| Float64Array | -1.8e308 | 1.8e308 | 8 | unrestricted double |
8 位整数
| 名称 | 数据类型 | 范围 |
|---|---|---|
| Int8Array | 有符号整数(字节) | -128/127 |
| Uint8Array | 无符号整数(八位字节) | 0/255 |
| Uint8ClampedArray | 无符号整数(八位字节) | 0/255 |
示例
创建一个包含 10 个有符号 8 位整数(字节格式)的类型化数组:
const myArr = new Int8Array(10);亲自试一试 »
创建一个包含 10 个无符号 8 位整数(八位字节格式)的类型化数组:
const myArr = new Uint8Array(10);亲自试一试 »
创建一个包含 10 个 8 位无符号整数(钳位格式)的类型化数组:
const myArr = new Uint8ClampedArray(10);亲自试一试 »Uint8Array 与 Uint8ClampedArray
Uint8Array 和 Uint8ClampedArray 的区别在于值的累加方式。
如果您将 Uint8ClampedArray 中的一个元素设置为 0-255 范围之外的值,它将默认为 0 或 255。
类型化数组只会取值的前 8 位。
注意
类型化数组并非真正的数组。
类型化数组的 isArray() 方法返回 false。
类型化数组不支持许多数组方法(例如 push 和 pop)。
16位整数
| 名称 | 数据类型 | 范围 |
|---|---|---|
| Int16Array | 短整型 | -32768/32767 |
| Uint16Array | 无符号短整型 | 0/65535 |
示例
创建一个包含 10 个有符号 16 位整数的类型化数组(简写格式):
const myArr = new Int16Array(10);亲自试一试 »
创建一个包含 10 个无符号 16 位整数(无符号短整型)的类型化数组:
const myArr = new Uint16Array(10);亲自试一试 »32 位整数
| 名称 | 数据类型 | 范围 |
|---|---|---|
| Int32Array | 有符号长整数 | -2147483648 / 2147483647 |
| Uint32Array | 无符号长整型 | 0 / 4294967295 |
示例
创建一个包含 10 个有符号 32 位整数(长格式)的类型化数组:
const myArr = new Int32Array(10);亲自试一试 »
创建一个包含 10 个无符号 32 位整数(无符号长整型)的类型化数组:
const myArr = new Uint32Array(10);亲自试一试 »64 位整数
| 名称 | 数据类型 | 范围 |
|---|---|---|
| BigInt64Array | 大有符号整数 | -263/263-1 |
| BigUint64Array | 大无符号整数 | 0/264 |
示例
创建一个包含 10 个有符号 64 位整数(bigint 格式)的类型化数组:
const myArr = new Bigint64Array(10);亲自试一试 »
创建一个包含 10 个无符号 64 位整数(bigint 格式)的类型化数组:
const myArr = new Biguint64Array(10);亲自试一试 »浮点数
| 名称 | 描述 | 范围 |
|---|---|---|
| Float16Array | 半精度 - 3 位有效数字 | -65504/ 65504 |
| Float32Array | 标准精度 - 7 位有效数字 | -3.4e38 / 3.4e38 |
| Float64Array | 双精度 - 15 位有效数字 | -1.8e308 /1.8e308 |
根据ECMAScript标准的规定,JavaScript 中的算术运算应使用双精度浮点运算:
示例
创建一个包含 10 个 16 位(半精度)浮点数的类型化数组:
const myArr = new Float16Array(10);亲自试一试 »
创建一个包含 10 个 32 位(标准精度)浮点数的类型化数组:
const myArr = new Float32Array(10);亲自试一试 »
创建一个包含 10 个 64 位(双精度)浮点数的类型化数组:
const myArr = new Float64Array(10);亲自试一试 »浏览器支持
类型化数组 是 ES6 特性。
自 2017 年 6 月起,所有现代浏览器均已完全支持 ES6。
| Chrome 51 |
Edge 15 |
Firefox 54 |
Safari 10 |
Opera 38 |
| 2016年5月 | 2017年4月 | 2017年6月 | 2016年9月 | 2016年6月 |
