格式 | 描述 | 用途 | 示例 |
---|---|---|---|
ArrayBuffer | 固定长度的二进制数据缓冲区,不直接操作具体的数据,而是通过类型数组或DataView对象来读写 | 用于存储和处理大量的二进制数据,如文件、图像等 | let buffer = new ArrayBuffer(16); |
TypedArray | 基于ArrayBuffer对象的视图,提供特定格式的读写接口 | 用于操作具有特定数据类型的二进制数据 | let int32View = new Int32Array(buffer); |
DataView | 提供对ArrayBuffer的复杂和灵活读写操作,可以读写任意位置的任意类型的数据 | 当需要精确控制二进制数据的读写位置和格式时使用 | let dataView = new DataView(buffer); |
Blob | 表示不可变的原始数据,通常是二进制数据或文本数据 | 用于处理文件、图片等二进制数据,可以通过URL.createObjectURL()创建对象URL | let blob = new Blob([arrayBuffer], {type: 'image/jpeg'}); |
File | 继承自Blob,表示用户系统上的具体文件 | 用于处理用户上传的文件,可以获取文件名、大小等信息 | let file = new File([blob], 'filename.jpg', {type: 'image/jpeg'}); |
Uint8Array | 8位无符号整数类型数组,用于存储0到255之间的整数 | 用于处理8位图像数据、字节流等 | let uint8Array = new Uint8Array(buffer); |
Uint16Array | 16位无符号整数类型数组,用于存储0到65535之间的整数 | 用于处理音频数据、图像数据等 | let uint16Array = new Uint16Array(buffer); |
Float32Array | 32位浮点数类型数组,用于存储浮点数 | 用于处理浮点数的二进制数据,如科学计算、物理模拟等 | let float32Array = new Float32Array(buffer); |
部分使用示例:
文章来源地址https://www.toymoban.com/news/detail-847603.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>二进制格式转换示例</title>
</head>
<body>
<input type="file" id="fileInput" accept="*" />
<button onclick="convertFileToBinaryFormats()">转换文件为二进制格式</button>
<pre id="output"></pre>
<script>
function convertFileToBinaryFormats() {
const fileInput = document.getElementById("fileInput");
const file = fileInput.files[0];
if (!file) {
alert("未选择文件");
return;
}
let reader = new FileReader(); // 使用let而不是const
reader.onload = function (event) {
const arrayBuffer = event.target.result;
// ArrayBuffer
console.log("ArrayBuffer:", arrayBuffer);
// TypedArray (例如 Uint8Array)
const uint8Array = new Uint8Array(arrayBuffer);
console.log("Uint8Array:", uint8Array);
// DataView
const dataView = new DataView(arrayBuffer);
console.log("DataView:", dataView);
// Blob
const blob = new Blob([arrayBuffer], { type: file.type });
console.log("Blob:", blob);
// 显示部分Uint8Array内容作为示例
const output = `文件类型: ${file.type}<br>`;
output += `ArrayBuffer长度: ${arrayBuffer.byteLength} 字节<br>`;
output += `Uint8Array前10个字节: ${Array.from(uint8Array.slice(0, 10))
.map((b) => b.toString(16).padStart(2, "0"))
.join(" ")}<br>`;
document.getElementById("output").textContent = output;
};
reader.readAsArrayBuffer(file);
}
</script>
</body>
</html>
文章来源:https://www.toymoban.com/news/detail-847603.html
到了这里,关于JS中的常见二进制数据格式的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!