导航
×
   ❮   
HTML CSS JavaScript PHP Go ECMS

JavaScript 教程

JS 简介 JS 如何使用 JS 输出 JS 语法 JS 语句 JS 注释 JS 变量 JS 运算符 JS 条件语句 JS 循环 JS 字符串 JS 数字 JS 函数 JS 对象 JS 日期 JS 数组 JS 类型化数组 JS 集合 JS Map 映射 JS Math JS 正则表达式 JS 数据类型 JS 错误 JS 事件 JS 编程 JS 关键字参考 JS 保留关键字参考 JS 运算符参考 JS 运算符优先级 JS UTF-8 字符 JS UTF-8 符号 JS UTF-8 表情符号 JS 版本

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 中的算术运算应使用双精度浮点运算:

64-bit

示例

创建一个包含 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月

freew3c.com 中文网是独立运营的中文开发者学习平台,与 freew3c.com 无关联。提供的内容仅用于学习和测试,不保证内容的正确性。


Copyright @2020-2026 京ICP备888888号-8