JavaScript Uint8Array – 使用方法和示例

JavaScript Uint8Array - 使用方法和示例

简介

JavaScript是一种广泛应用的编程语言，用于在Web页面中添加交互性和动态性。而Uint8Array是JavaScript中的一个内置类型，用于表示无符号的8位整数数组。本文将详细介绍Uint8Array的使用方法和示例。

创建`Uint8Array`

Uint8Array可以通过以下方式进行创建：
1. 通过new关键字和构造函数创建
2. 通过TypedArray.from()方法从其他类型数组创建
3. 通过TypedArray.of()方法从一组指定的值创建

通过`new`关键字和构造函数创建

可以使用new关键字和构造函数来创建一个空的Uint8Array，并且可以指定其长度。

let uintArray = new Uint8Array(4);
console.log(uintArray);

输出结果：

Uint8Array(4) [0, 0, 0, 0]

以上代码创建了一个长度为4的Uint8Array，并将其初始值都设置为0。

我们还可以通过传递一个带有初始值的数组来创建Uint8Array，其中数组的每个元素将被转换为Uint8Array中的一个8位整数。

let array = [10, 20, 30, 40];
let uintArray = new Uint8Array(array);
console.log(uintArray);

输出结果：

Uint8Array(4) [10, 20, 30, 40]

以上代码创建了一个包含初始值的Uint8Array，其中数组中的每个元素被转换为对应的8位整数。

通过`TypedArray.from()`方法从其他类型数组创建

TypedArray.from()方法可以从一个具有可迭代对象的数组创建一个新的TypedArray。

例如，我们可以从一个常规的数组创建Uint8Array，其中数组元素的类型可以是任何兼容Uint8Array的类型。

let array = [10, 20, 30, 40];
let uintArray = Uint8Array.from(array);
console.log(uintArray);

输出结果：

Uint8Array(4) [10, 20, 30, 40]

以上代码将一个常规的数组转换为对应的Uint8Array。

通过`TypedArray.of()`方法从一组指定的值创建

TypedArray.of()方法可用于创建一个新的TypedArray，并且可以接受多个值作为参数。

let uintArray = Uint8Array.of(10, 20, 30, 40);
console.log(uintArray);

输出结果：

Uint8Array(4) [10, 20, 30, 40]

以上代码利用Uint8Array.of()方法创建了一个包含指定的值的Uint8Array。

访问和修改`Uint8Array`的元素

通过索引可以访问和修改Uint8Array中的元素。索引从0开始，可以使用方括号或者点语法访问元素。

let uintArray = new Uint8Array(4);
uintArray[0] = 10;
uintArray[1] = 20;
console.log(uintArray);

console.log(uintArray[0]);
console.log(uintArray[1]);

输出结果：

Uint8Array(4) [10, 20, 0, 0]
10
20

以上代码修改了Uint8Array的前两个元素，并通过索引访问了这两个元素。

遍历`Uint8Array`

可以使用for...of循环遍历Uint8Array中的元素。

let uintArray = Uint8Array.of(10, 20, 30, 40);
for (let element of uintArray) {
    console.log(element);
}

输出结果：

以上代码使用for...of循环遍历了Uint8Array中的每个元素，并将其打印到控制台上。

`Uint8Array`的常用操作方法

Uint8Array提供了一些用于操作数组的常用方法，例如set()、subarray()和slice()等。

`set()`方法

set()方法用于将一个数组或其他可迭代对象中的值复制到Uint8Array中。

let sourceArray = [35, 46, 57, 68];
let targetArray = new Uint8Array(4);
targetArray.set(sourceArray);
console.log(targetArray);

输出结果：

Uint8Array(4) [35, 46, 57, 68]

以上代码使用set()方法将sourceArray中的值复制到了targetArray中。

`subarray()`方法

subarray()方法返回一个新的Uint8Array，其中包含了当前Uint8Array的一部分。

let uintArray = Uint8Array.of(10, 20, 30, 40, 50);
let subArray = uintArray.subarray(1, 4);
console.log(subArray);

输出结果：

Uint8Array(3) [20, 30, 40]

以上代码使用subarray()方法获取了uintArray的索引为1到3的子数组。

`slice()`方法

slice()方法返回一个新的Uint8Array，其中包含了当前Uint8Array的一部分。

let uintArray = Uint8Array.of(10, 20, 30, 40, 50);
let slicedArray = uintArray.slice(1, 4);
console.log(slicedArray);

输出结果：

Uint8Array(3) [20, 30, 40]

以上代码使用slice()方法获取了uintArray的索引为1到3的子数组。

`Uint8Array`和字符串的相互转换

Uint8Array和字符串之间的相互转换在实际开发中经常会遇到。Uint8Array.from()和TextDecoder可以用于从字符串转换为Uint8Array，TextEncoder可以用于从Uint8Array转换为字符串。

从字符串转换为`Uint8Array`

可以使用TextEncoder对象将字符串转换为Uint8Array。TextEncoder是一个内置类，可以将字符串转换为字节数组。

let text = 'Hello, World!';
let encoder = new TextEncoder();
let encodedData = encoder.encode(text);
console.log(encodedData);

输出结果：

Uint8Array(14) [72, 101, 108, 108, 111, 44, 32, 87, 111, 114, 108, 100, 33]

以上代码使用TextEncoder将字符串text转换为了对应的Uint8Array。

从`Uint8Array`转换为字符串

可以使用TextDecoder对象将Uint8Array转换为字符串。TextDecoder是一个内置类，可以将字节数组转换为字符串。

let uintArray = Uint8Array.of(72, 101, 108, 108, 111, 44, 32, 87, 111, 114, 108, 100, 33);
let decoder = new TextDecoder();
let decodedData = decoder.decode(uintArray);
console.log(decodedData);

输出结果：

Hello, World!

以上代码使用TextDecoder将uintArray转换为对应的字符串。

`Uint8Array`的常用方法和属性

除了上述提到的操作方法外，Uint8Array还提供了其他一些常用的方法和属性。

`length`属性

length属性表示Uint8Array中的元素个数。

let uintArray = new Uint8Array(4);
console.log(uintArray.length);

输出结果：

以上代码输出了uintArray中的元素个数。

`fill()`方法

fill()方法用指定的值填充Uint8Array的所有元素。

let uintArray = new Uint8Array(4);
uintArray.fill(5);
console.log(uintArray);

输出结果：

Uint8Array(4) [5, 5, 5, 5]

以上代码将uintArray中的所有元素都设置为5。

`copyWithin()`方法

copyWithin()方法将Uint8Array中的一部分元素复制到指定位置。

let uintArray = Uint8Array.of(1, 2, 3, 4, 5);
uintArray.copyWithin(2, 0, 2);
console.log(uintArray);

输出结果：

Uint8Array(5) [1, 2, 1, 2, 5]

以上代码将uintArray中索引为0到1的元素复制到了索引为2的位置。

`sort()`方法

sort()方法用于对Uint8Array中的元素进行排序。

let uintArray = Uint8Array.of(4, 2, 1, 3, 5);
uintArray.sort();
console.log(uintArray);

输出结果：

Uint8Array(5) [1, 2, 3, 4, 5]

以上代码对uintArray中的元素进行了排序。

`toString()`方法

toString()方法将Uint8Array转换为字符串，并返回结果。

let uintArray = Uint8Array.of(65, 66, 67);
let string = uintArray.toString();
console.log(string);

输出结果：

A,B,C

以上代码将uintArray转换为字符串，并输出结果。

总结

本文介绍了JavaScript中Uint8Array的使用方法和示例。我们了解了如何创建Uint8Array，访问和修改其元素，以及遍历Uint8Array的方法。同时，还了解了Uint8Array的常用操作方法和属性，以及与字符串之间的相互转换。Uint8Array在处理二进制数据时非常有用，可以方便地进行读取和操作。通过掌握Uint8Array的使用，我们能够更好地处理和管理二进制数据。