ECMAScript 2016(ES7)中的 TypedArray 数据类型详解
介绍
在 ECMAScript 2016(ES7)中,TypedArray 是一个全新的数据类型,主要用于处理字节流和处理大规模数据。
TypedArray 是属于 ArrayBuffer 对象的视图,并提供了一个类似于数组的接口来操作 ArrayBuffer 的二进制数据。
目前 TypedArray 支持以下五种数据类型:
- Int8Array: 用于处理 8 位 (1 字节) 有符号整数。
- Uint8Array: 用于处理 8 位 (1 字节) 无符号整数。
- Uint8ClampedArray: 用于处理 8 位 (1 字节) 无符号整数,但有个限制,即它对于大于 255 的数值会强制转换为 255。
- Int16Array: 用于处理 16 位 (2 字节) 有符号整数。
- Uint16Array: 用于处理 16 位 (2 字节) 无符号整数。
- Int32Array: 用于处理 32 位 (4 字节) 有符号整数。
- Uint32Array: 用于处理 32 位 (4 字节) 无符号整数。
- Float32Array:用于处理 32 位 (4 字节) 浮点数。
- Float64Array:用于处理 64 位 (8 字节) 浮点数。
TypedArray 的使用
创建 TypedArray
创建方式:
let buffer = new ArrayBuffer(10); let typedArray = new Int8Array(buffer); console.log(typedArray);
其中,new ArrayBuffer() 用于创建一个指定大小的 ArrayBuffer,Int8Array() 则将其作为参数传递。
使用数据的大小会在创建时固定,不能更改。所以在创建前,必须确定其大小。
访问和修改数据:
let buffer = new ArrayBuffer(10); let int8Array = new Int8Array(buffer); int8Array[0] = 10; console.log(int8Array[0]); // 10
访问和修改数据的方式与数组相同,不同的是修改数据的过程必须保证数据类型一致,否则会出现类型错误。
let buffer = new ArrayBuffer(10); let int8Array = new Int8Array(buffer); int8Array[0] = "10"; // TypeError: Invalid value used in weak set
借助 set() 方法进行数据操作:
let buffer = new ArrayBuffer(10); let uint8Array = new Uint8Array(buffer); uint8Array.set([5, 6]); console.log(uint8Array); // Uint8Array [5, 6, 0, 0, 0, 0, 0, 0, 0, 0]
数组拷贝:
let buffer = new ArrayBuffer(10); let uint8Array1 = new Uint8Array(buffer, 0, 3); let uint8Array2 = new Uint8Array(buffer, 3, 3); uint8Array1.set([1, 2, 3]); uint8Array2.set(uint8Array1.subarray(0, 2)); console.log(uint8Array1); // Uint8Array [1, 2, 3] console.log(uint8Array2); // Uint8Array [1, 2, 0]
数组填充:
let buffer = new ArrayBuffer(10); let uint8Array = new Uint8Array(buffer); uint8Array.fill(1); console.log(uint8Array); // Uint8Array [1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
数组排序:
let buffer = new ArrayBuffer(10); let uint8Array = new Uint8Array(buffer); uint8Array.set([3, 2, 1]); console.log(uint8Array.sort()); // Uint8Array [1, 2, 3]
TypedArray 对比原生 Array
TypedArray 和原生 Array 的用法基本相同,但有一些细微的区别和不同,如下:
TypedArray 与原生 Array 的区别:
- TypedArray 中存储的是二进制数据,而不是任意类型的数据。
- TypedArray 中的数据类型固定,不可扩展。
- TypedArray 中的元素不支持操作符 in。
- TypedArray 不支持 push() 和 pop() 等非字节级别的操作。
- TypedArray 不支持 sort(),但是支持 sort() 方法作用于 TypedArray 的视图。
在一些特定的场景下,TypedArray 将原生 Array 大幅降低内存占用,提高性能。
例如,使用原生 Array 存储一个 100 万个 int 类型数据的数组,内存占用约 32MB,而使用 TypedArray 则只占用约 4MB。
结论
在本文中,我们详细介绍了 ECMAScript 2016(ES7)中的 TypedArray,这是一个全新的数据类型,用于处理字节流和处理大规模数据。
我们了解了 TypedArray 的创建、修改、访问、数据拷贝、数组填充、数组排序等操作,并与原生 Array 进行了对比。
在一些特定的场景下,TypedArray 将原生 Array 大幅降低内存占用,提高性能。因此,在处理大规模数据时,推荐使用 TypedArray 进行处理,以提高效率。
示例代码
let buffer = new ArrayBuffer(10); let uint8Array1 = new Uint8Array(buffer, 0, 3); let uint8Array2 = new Uint8Array(buffer, 3, 3); uint8Array1.set([1, 2, 3]); uint8Array2.set(uint8Array1.subarray(0, 2)); console.log(uint8Array1); // Uint8Array [1, 2, 3] console.log(uint8Array2); // Uint8Array [1, 2, 0]
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/670895b9d91dce0dc872a65c