当前位置：首页 > news >正文

「JavaScript深入」二进制数据处理详解「Blob、File、FileReader、ArrayBuffer、Typed Arrays、DataView」

news 来源：原创 2025/8/21 1:01:39

二进制数据处理详解

- 1. Blob（Binary Large Object）
- - Blob 的特性
  - 创建 Blob
  - Blob 主要方法
  - Blob 的应用
- 2. File
- - File 对象的属性
  - 获取 File 对象
- 3. FileReader
- - 创建 FileReader
  - 主要方法
  - 主要事件
  - 文件上传与读取内容示例
  - 文件分块读取示例
- 4. ArrayBuffer 与 Typed Arrays、DataView
- - ArrayBuffer
  - - ArrayBuffer 使用领域
  - Typed Arrays
  - - 创建 Typed Arrays
  - DataView
  - - DataView 示例
  - Typed Arrays 和 DateView 选择
- 5. ArrayBuffer vs Blob
- 6. 图像颜色反转示例
- 结论

JavaScript 主要用于处理文本数据，但在更复杂的应用（如图像、音频、视频处理）中，二进制数据的操作变得尤为重要。下面将深入探讨 JavaScript 提供的二进制数据操作 API

Blob：用于代表不可变的二进制数据（如文件）
File：继承自 Blob，代表用户从文件系统选择的具体文件
FileReader：用于读取 File 或 Blob 对象的内容
ArrayBuffer：代表通用、固定长度的原始二进制数据缓冲区
Typed Arrays：提供了一种操作 ArrayBuffer 中数据的方式，支持多种数据类型（如 Uint8Array、Float32Array 等）
DataView：允许以任意字节顺序（endianness）读取和写入 ArrayBuffer 中的数据

1. Blob（Binary Large Object）

Blob 代表不可变的二进制数据块，通常用于处理文件、图像、音频等类型的数据。

Blob 的特性

支持二进制数据：可存储文本、图像、音频等数据。
不可变性：创建后 Blob 数据不能被修改。
分块存储：可使用 slice() 方法将 Blob 拆分为多个小块。

创建 Blob

// 从字符串创建 Blob
const text = "Hello, Blob!";
// 为 Blob 指定正确的 MIME 类型，确保数据在使用时被正确解析和处理
const blob = new Blob([text], { type: 'text/plain' });
console.log(blob.size); // 12
console.log(blob.type); // 'text/plain'// 从二进制数据创建 Blob
const bytes = new Uint8Array([0x48, 0x65, 0x6C, 0x6C, 0x6F]); // 'Hello'
const binaryBlob = new Blob([bytes], { type: 'application/octet-stream' });
console.log(binaryBlob.size); // 5
console.log(binaryBlob.type); // 'application/octet-stream'

Blob 主要方法

slice(start, end, contentType): 截取 Blob 的部分数据，生成新的 Blob 片段。
arrayBuffer(): 将 Blob 转换为 ArrayBuffer，适用于二进制数据操作。
text(): 将 Blob 转换为字符串，适用于文本数据读取。
stream(): 将 Blob 转换为字符串，适用于文本数据读取。

Blob 的应用

👇 Blob 对象常用于处理文件上传和下载。例如通过 Blob 可以创建一个包含特定数据的文件，然后通过 URL.createObjectURL 将其转换为下载链接

const data = "Sample data for download";
const blob = new Blob([data], { type: 'text/plain' });
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = 'sample.txt';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);

👇 Blob 也经常用于处理和操作图像数据，例如将 Canvas 内容转换为图像 Blob，然后显示

const canvas = document.getElementById('myCanvas');
canvas.toBlob((blob) => {const url = URL.createObjectURL(blob);const img = document.createElement('img');img.src = url;document.body.appendChild(img);
}, 'image/png');

在不需要时使用 URL.revokeObjectURL() 释放对象 URL，防止内存泄漏

👇 在进行网络通信时，Blob 可以作为数据传输的容器，尤其是在使用 fetch API 时传输二进制数据

fetch('https://example.com/api/upload', {method: 'POST',body: blob,headers: {'Content-Type': 'text/plain'}
}).then(response => {return response.json();
}).then(data => {console.log(data);
});

2. File

File 继承自 Blob，表示来自用户文件系统的文件，并包含额外的元数据（如文件名、大小和类型）。

File 对象的属性

属性	描述
`name`	文件名称，包含扩展名
`size`	文件大小（字节）
`type`	MIME 类型
`lastModified`	最后修改时间（时间戳）
`lastModifiedDate`	lastModified 的 Date对象
`webkitRelativePath`	用户选择文件时的相对路径

获取 File 对象

最常见的 File 对象创建方式是通过用户在网页中上传文件。这通常通过元素或拖放操作实现

<input type="file" id="fileInput">
<script>
const fileInput = document.getElementById('fileInput');
fileInput.addEventListener('change', (event) => {const file = event.target.files[0];console.log(`文件名: ${file.name}, 文件大小: ${file.size} 字节`);
});
</script>

3. FileReader

FileReader 允许异步读取 File 或 Blob 内容，支持文本、Data URL 和 ArrayBuffer 读取。

创建 FileReader

FileReader 对象可以通过调用其构造函数直接创建

const reader = new FileReader();

使用 FileReader.abort() 方法可以取消正在进行的读取操作

主要方法

readAsArrayBuffer(blob): 读取 Blob 并返回 ArrayBuffer。
readAsDataURL(blob): 读取 Blob 并返回 data URL（base64 编码的字符串）。
readAsText(blob, encoding): 读取 Blob 并返回文本字符串。

主要事件

当调用上述方法后会触发 FileReader 的事件

事件	描述
`onloadstart`	开始读取操作时触发
`onprogress`	onprogress 读取过程中定期触发，可用于显示进度
`onabort`	读取操作被中止时触发
`onerror`	读取过程中发生错误时触发
`onload`	读取操作成功完成时触发
`onloadend`	读取操作完成（无论成功或失败）时触发

文件上传与读取内容示例

👇 在用户上传文件后，使用 FileReader 可以提前读取文件内容，进行预览、验证或处理。

<!DOCTYPE html>
<html><head><title>读取文本文件示例</title></head><body><input type="file" id="textFileInput" accept=".txt, .md" /><pre id="fileContent"></pre><script>const textFileInput = document.getElementById('textFileInput');const fileContent = document.getElementById('fileContent');textFileInput.addEventListener('change', (event) => {const file = event.target.files[0];if (file) {const reader = new FileReader();reader.onload = (e) => {fileContent.textContent = e.target.result;};reader.onerror = () => {fileContent.textContent = '读取文件时发生错误。';};reader.readAsText(file);} else {fileContent.textContent = '未选择任何文件。';}});</script></body>
</html>

👇 使用 readAsDataURL 方法，可以将用户上传的图像文件转换为可以直接在网页中显示的 URL

<!DOCTYPE html>
<html>
<head><title>图像预览示例</title>
</head>
<body><input type="file" id="imageInput" accept="image/*" /><img id="imagePreview" src="" alt="图像预览" style="max-width: 300px;" /><script>const imageInput = document.getElementById('imageInput');const imagePreview = document.getElementById('imagePreview');imageInput.addEventListener('change', (event) => {const file = event.target.files[0];if (file) {const reader = new FileReader();reader.onload = (e) => {imagePreview.src = e.target.result;};reader.onerror = () => {console.error('读取图像文件时发生错误。');};reader.readAsDataURL(file);} else {imagePreview.src = '';}});</script>
</body>
</html>

文件分块读取示例

对于非常大的文件，可以利用 Blob.slice 方法分块读取，避免占用过多内存。

const chunkSize = 1024 * 1024; // 1MB
let offset = 0;function readChunk(file) {if (offset >= file.size) return;const slice = file.slice(offset, offset + chunkSize);const reader = new FileReader();reader.onload = (event) => {const text = event.target.result;console.log(`读取第 ${offset / chunkSize + 1} 块:`, text);offset += chunkSize;readChunk(file);};reader.onerror = () => {console.error('读取块时发生错误。');};reader.readAsText(slice);
}readChunk(file);

4. ArrayBuffer 与 Typed Arrays、DataView

ArrayBuffer

ArrayBuffer 是一种用于表示通用、固定长度的原始二进制数据缓冲区，它是处理二进制数据的基础，可以用于存储各种类型的数据，必须通过 Typed Arrays 或 DataView 访问。

ArrayBuffer 使用领域

网络通信： WebSockets 和 Fetch API: 在与服务器进行低级网络通信时，ArrayBuffer 可以用于发送和接收二进制数据
科学计算和数据分析： 在需要高效率大量数据运算的应用中（如图像处理、音频处理、科学计算），ArrayBuffer 配合 TypedArray 可实现更高效的数据处理
图像处理： 可以在 Canvas 元素中使用 ArrayBuffer 来高效处理图像数据
大数据处理： ArrayBuffer 提供了对内存中二进制数据的直接访问权限，这在处理大数据集时尤其有用

// 创建一个 8 字节的 ArrayBuffer
const buffer = new ArrayBuffer(8);console.log(buffer.byteLength); // 输出: 8

ArrayBuffer 本身不能直接读取或写入数据，必须通过 Typed Arrays 或 DataView 对象来操作 👇👇👇

Typed Arrays

TypedArray 提供了一种操作 ArrayBuffer 中数据的方式，允许以特定的字节序和数据类型读写二进制数据

👇 JavaScript 提供了多种类型的 TypedArray ，每种对应不同的数据类型和字节长度，它们为不同的数据类型（如整数、浮点数）提供了高效的操作接口

类型	描述	字节长度
`Int8Array`	8 位有符号整数	1
`Uint8Array`	8 位无符号整数	1
`Uint8ClampedArray`	8 位无符号整数，值被夹断到 [0, 255]	1
`Int16Array`	16 位有符号整数	2
`Uint16Array`	16 位无符号整数	2
`Int32Array`	32 位有符号整数	4
`Uint32Array`	32 位无符号整数	4
`Float32Array`	32 位浮点数	4
`Float64Array`	64 位浮点数	8
`BigInt64Array`	64 位有符号大整数（ES2020 引入）	8
`BigUint64Array`	64 位无符号大整数（ES2020 引入）	8

创建 Typed Arrays

Typed Arrays 特别适用于科学计算、图像处理、音频处理等需要高性能的数据操作场景

// 16 字节的缓冲区
const buffer = new ArrayBuffer(16);// 创建一个 Float32Array 视图
const floatView = new Float32Array(buffer);floatView[0] = 3.14;
floatView[1] = 2.718;console.log(floatView); // 输出: Float32Array [ 3.14, 2.718, 0, 0 ]

DataView

DataView 提供了一种更灵活的方式来操作 ArrayBuffer 中的数据，允许以任意的字节序（大端或小端）读写不同类型的数据。

相比 Typed Arrays，DataView 更加通用，适用于需要处理复杂数据结构的场景

DataView 示例

const buffer = new ArrayBuffer(16); // 16 字节的缓冲区
const dataView = new DataView(buffer);// 设置不同类型的数据
dataView.setInt8(0, 127);          // 第一个字节设置为有符号 8 位整数
dataView.setUint16(1, 65000, true); // 从第 1 个字节开始，设置无符号 16 位整数，字节序为小端
dataView.setFloat32(3, 3.14, false); // 从第 3 个字节开始，设置 32 位浮点数，字节序为大端// 读取数据
console.log(dataView.getInt8(0));      // 输出: 127
console.log(dataView.getUint16(1, true)); // 输出: 65000
console.log(dataView.getFloat32(3, false)); // 输出: 3.140000104904175

Typed Arrays 和 DateView 选择

如果需要处理同一类型的数据，且不需要控制字节序，使用 Typed Arrays 更为方便和高效
如果需要处理复杂的数据结构，或需要在数据中混合多种类型，且需要控制字节序，使用 DataView 更为合适

5. ArrayBuffer vs Blob

ArrayBuffer 和 Blob 在 JavaScript 中都是用于处理二进制数据的对象，在部分场景两者都能胜任，但擅长的场景有所区别

特性	ArrayBuffer	Blob
可变性	可变	不可变
读取方式	需要 TypedArray 或 DataView	直接使用 FileReader
适用场景	计算、数据分析、网络通信	文件处理、存储、传输

6. 图像颜色反转示例

假设我们从服务器获取了一张灰度图像的二进制数据，我们需要对其进行处理，比如反转颜色。

// 模拟从服务器获取的图像数组（二进制数据）
function fetchImageData() {// 假设我们有一个 2x2 的灰度图像示例数据（4 个像素，每个像素 8 位灰度值）return new Uint8Array([100, 150, 200, 250]); // 灰度值
}function processImageData() {// 获取图像数据let imageData = fetchImageData();// 创建一个 ArrayBuffer，长度与 imageData 相同let buffer = new ArrayBuffer(imageData.length);// 创建一个视图来操作这个缓冲区let view = new Uint8Array(buffer);// 复制数据到缓冲区for (let i = 0; i < imageData.length; i++) {view[i] = imageData[i];}// 处理图像数据（颜色反转）for (let i = 0; i < view.length; i++) {view[i] = 255 - view[i]; // 反转灰度值}// 输出处理后的数据console.log('Processed Image Data:', view);
}processImageData();

结论

JavaScript 提供了一系列强大的二进制数据处理 API，能够高效地处理文件、图像、音频等数据。掌握它们能大幅提升 Web 应用的能力，满足更复杂的数据处理需求。

「JavaScript深入」二进制数据处理详解「Blob、File、FileReader、ArrayBuffer、Typed Arrays、DataView」

二进制数据处理详解 1. Blob（Binary Large Object）Blob 的特性创建 BlobBlob 主要方法Blob 的应用 2. FileFile 对象的属性获取 File 对象 3. FileReader创建 FileReader主要方法主要事件文件上传与读取内容示例文件分块读取示例 4. ArrayBuffer 与 Type…...

编程日记 2025/8/21 1:01:39

信号处理之插值、抽取与多项滤波

信号处理之插值、抽取与多项滤波一、问题背景插值(Interpolation)与抽取(Decimation)是数字信号处理中采样率转换的核心操作： 插值：在信号中插入新样本以提高采样率（ L L L倍）抽取：按比例 M M M降低采样率&#xf…...

编程日记 2025/8/18 10:45:17

关于WPS的Excel点击单元格打开别的文档的两种方法的探究

问题需求目录和文件结构如下： E:\Dir_Level1 │ Level1.txt │ └─Dir_Level2│ Level2.txt│ master.xlsx│└─Dir_Level3Level3.txt现在要在master.xlsx点击单元格进而访问Level1.txt、Level2.txt、Level3.txt这些文件。方法一：“单元格右键…...

编程日记 2025/8/16 11:15:23

蓝桥 2109统计子矩阵

问题描述给定一个NM 的矩阵 A, 请你统计有多少个子矩阵 (最小 11, 最大 NM) 满足子矩阵中所有数的和不超过给定的整数 K ? 输入格式第一行包含三个整数 N,M 和 K. 之后 NN 行每行包含 M 个整数, 代表矩阵 A. 输出格式一个整数代表答案。样例输入 3 4 10 1 2 3 4 5…...

编程日记 2025/8/18 9:02:18

AF3 make_fixed_size函数解读

AlphaFold3 data_transforms 模块的 make_fixed_size 函数的作用是将输入的蛋白质特征字典 protein 中的各个特征张量调整为固定大小。这是为了确保在批量处理时，所有特征张量的形状一致，从而避免形状不匹配的问题。源代码： import itertools import torch from src.con…...

编程日记 2025/8/19 15:13:21

前端模块管理新思路：如何使用 Import Maps

前言前端开发中，我们常常需要使用各种库和模块来构建功能丰富的应用。在传统方式中，管理这些库和模块的引用可能会有些繁琐。幸运的是，Import Maps 的出现为我们提供了一种更简洁和高效的解决方案。今天我们就来聊聊如何使用 Import Maps。…...

编程日记 2025/8/21 0:57:33

交换机、路由器、网关、MAC地址——从入门到实战

你是否好奇，当你在手机上点击一个网页链接时，数据是如何从你的设备“飞”到千里之外的服务器并返回的？背后离不开交换机、路由器、网关和MAC地址的默契配合。本文用通俗语言实战场景，带你彻底搞懂这些网络核心组件，从此…...

编程日记 2025/8/20 18:48:13

【江协科技STM32】ADC数模转换器-学习笔记

ADC简介 ADC（Analog-Digital Converter）模拟-数字转换器ADC可以将引脚上连续变化的模拟电压转换为内存中存储的数字变量，建立模拟电路到数字电路的桥梁，ADC是一种将连续的模拟信号转换为离散的数字信号的设备或模块12位逐次逼近型…...

编程日记 2025/8/16 12:46:26

LanceDB快速入门之基本操作与API一览

LanceDB可以以多种方式运行可以嵌入到现有后端（如您的 Django、Flask、Node.js 或 FastAPI 应用程序）中直接从如 Jupyter 笔记本等客户端应用程序中用于分析工作负载部署为远程无服务器数据库安装 Python： pip install lancedbTypeScrip…...

编程日记 2025/8/17 17:29:46

Spring Boot 整合 Redis

以下是 Spring Boot 整合 Redis 的指南，涵盖配置、基本操作、高级用法及常见问题解决。 1. 添加依赖在 pom.xml 中添加 Spring Data Redis 和连接池依赖： <dependency><groupId>org.springframework.boot</groupId><artifactId&…...

编程日记 2025/8/19 14:01:39

七层协议攻防实战：从HTTP慢速攻击到DNS隧道检测

一、七层协议攻击类型与特征攻击类型协议特征HTTP慢速攻击HTTP低速率发送不完整请求DNS隧道DNS异常长域名、高频率TXT查询API滥用攻击HTTP高频调用关键接口（如短信发送）WebSocket洪水WebSocket海量小消息耗尽服务器资源二、HTTP协议深度防护 1. 慢速…...

编程日记 2025/8/18 14:50:56

Java CAS（Compare-And-Swap）概念及原理

Java CAS（Compare-And-Swap）概念及原理 1. CAS的基本概念 CAS（Compare-And-Swap）是一种无锁编程的核心技术，用于实现多线程环境下的原子操作。其核心思想是： “先比较，再交换”。具体操作包含…...

编程日记 2025/8/16 12:15:11

内存检测工具——Qt Creator

前言检测内存错误的工具，有很多个，我今天粗浅的学了一下可在Qt上使用的工具们： Dr.Memory 工具之前我曾在关注的博主上看到相关的博客：C(Qt)软件调试---内存调试器Dr.Memory（21）_dr. memory-CSDN博客今…...

编程日记 2025/8/17 23:43:02

Ubuntu切换lowlatency内核

文章目录一. 前言二. 开发环境三. 具体操作一. 前言低延迟内核（Lowlatency Kernel） 旨在为需要低延迟响应的应用程序设计的内核版本。Linux-lowlatency特别适合音频处理、实时计算、游戏和其他需要及时响应的实时任务。其主要特点是优化了中断处理、调…...

编程日记 2025/8/20 11:44:04

侯捷 C++ 课程学习笔记：STL标准库与泛型编程

STL 体系结构基础介绍 STL 六大部件： 容器（Containers） 分配器（Allocators） …...

编程日记 2025/8/18 10:56:49

Java 大视界 -- Java 大数据在智能安防视频摘要与检索技术中的应用（128）

💖亲爱的朋友们，热烈欢迎来到青云交的博客！能与诸位在此相逢，我倍感荣幸。在这飞速更迭的时代，我们都渴望一方心灵净土，而我的博客正是这样温暖的所在。这里为你呈上趣味与实用兼具的知识，也…...

编程日记 2025/8/20 4:28:29

19874并查集

19874并查集 ⭐️难度：中等 🌟考点：并查集、数据结构 📖 📚 import java.util.*;public class Main {static int N 100010;static int[] a new int[N];static int[] p new int[N];static int n;static int m;st…...

编程日记 2025/8/19 3:51:57

ABC 376

目录 D. Cycle D. Cycle（改） E. Max Sum D. Cycle 这道题就是个 01 最短路，直接从 1 开始 bfs 看能不能回到 1 #include<bits/stdc.h> #define int long long using namespace std; const int N 2e5 5, INF 1e18;struct node {int …...

编程日记 2025/8/19 0:01:52

win32汇编环境,对 WM_MOUSEMOVE 消息的理解

;运行效果 ;win32汇编环境,对 WM_MOUSEMOVE 消息的理解 ;理解在 WM_MOUSEMOVE 消息发生时，同时来的wParam和lParam值的含义，并取出各自的值进行运用。从这例子也可以更好的理解windows的消息机制. ;WM_MOUSEMOVE消息就是当鼠标移动时，发送给窗…...

编程日记 2025/8/18 18:43:13

第27周JavaSpringboot电商进阶开发 2.常用功能进阶

电商常用功能进阶 - 课程笔记整理 Excel解析与处理一、课程内容概述本小节开始进入电商常用功能进阶部分，主要讲解以下内容： Excel的解析和处理商品图片的处理Valid注解对列表的验证订单数变化趋势图Spring Boot高级功能二、Excel解析与处理的背…...

编程日记 2025/8/18 15:32:31

网络安全基础知识：从零开始了解网络安全

### 网络安全基础知识：从零开始了解网络安全欢迎来到《零基础入门到独立参加网络安全比赛》系列教程的第一篇！在这篇文章中，我们将从最基础的概念开始，深入探讨网络安全的定义、重要性、常见的网络攻击类型，以及网络…...

编程日记 2025/8/19 13:55:42

【A2DP】蓝牙A2DP协议剖析：从架构到规范

目录一、A2DP 协议架构 1.1 A2DP 协议栈结构组成 1.2 协议栈各部分的关系与作用二、设备配置与角色定义（Configurations and roles ） 2.1 角色定义 2.2 配置示例与角色体现三、用户需求与场景 3.1 用户需求与场景 3.2 协议限制 3.3 协议要求…...

编程日记 2025/8/16 8:22:00

python力扣15. 三数之和

给你一个整数数组 nums ，判断是否存在三元组 [nums[i], nums[j], nums[k]] 满足 i ! j、i ! k 且 j ! k ，同时还满足 nums[i] nums[j] nums[k] 0 。请你返回所有和为 0 且不重复的三元组。注意：答案中不可以包含重复的三元组。示例 1&am…...

编程日记 2025/8/19 2:29:24

Linux之系统文件目录理解

1.boot/ 存储启动系统的相关文件的 2.swap/ 虚拟内存 3.dev/ 用于存放设备文件（device files）。这些文件是操作系统与硬件设备之间的接口，允许用户和程序通过文件操作的方式访问硬件资源字符设备（Character Devices&#xf…...

编程日记 2025/8/17 22:03:26

uvm_transaction, uvm_seq_item, uvm_object, uvm_component的关系

uvm_object ├── uvm_component (验证环境中的静态组件) └── uvm_transaction└── uvm_sequence_item (用于sequence-driver交互的事务) 2. 核心类的作用与区别 (1) uvm_object 定位：所有UVM类的基类。功能： 提供基础的对象操作&…...

编程日记 2025/8/19 12:32:32

主要区别在this指向不同，下面输出张三还是李四?： const person{name:张三,get FullName(){return this.name;},};let personProxynew Proxy(person,{get(target,key){return Reflect.get(target,key)//或者return target[key]}});const p1{__proto__:pe…...

编程日记 2025/8/16 11:39:10

K8s 1.27.1 实战系列（十）PV PVC

一、核心概念与关系 1、PV（Persistent Volume） PV 是集群中的持久化存储资源，由管理员预先创建并配置，独立于 Pod 生命周期。它抽象了底层存储（如 NFS、云存储等），定义存储容量、访问模式（如 ReadWriteOnce）、回收策略（Retain/Delete/Recycle）等属性。例如，一…...

编程日记 2025/8/18 12:24:23

JQuery

1.jquery介绍 jQuery是目前使用最广泛的javascript函数库。据统计，全世界排名前100万的网站，有46%使用jQuery，远远超过其他库。微软公司甚至把jQuery作为他们的官方库。 jQuery的版本分为1.x系列和2.x、3.x系列，1.x系列兼容低版…...

编程日记 2025/8/18 5:25:58

「AI 加持的高效架构」高并发场景下的服务器成本优化

网罗开发 （小红书、快手、视频号同名） 大家好，我是展菲，目前在上市企业从事人工智能项目研发管理工作，平时热衷于分享各种编程领域的软硬技能知识以及前沿技术，包括iOS、前端、Harmony OS、Java、Python等…...

编程日记 2025/8/16 10:33:19

html css 笔记

01_浏览器相关知识五大主流浏览器： Chrome Safari IE Firefox Opera (拥有自己的内核) 四大内核: webkit Trident Gecko blink. 02_网页相关知识构成网址网站网页网页标准： 结构表现行为分别对应 HTML CSS JavaScript 03_HTML简介 H…...

编程日记 2025/8/20 6:27:59

通义万相 2.1：AIGC 领域的 “王炸” 组合如何颠覆创作生态？

引言在数字化和人工智能的飞速发展中，AIGC（AI生成内容）技术已经成为推动创作、设计和内容生成领域创新的核心力量。而当通义万相2.1与蓝耘智算平台强强联手，这一“王炸”组合不仅提升了AIGC的效率，还为创作生态带来了…...

编程日记 2025/8/16 10:40:52

Math.NET Numerics 库怎么装

你提到的缺少的库是 Math.NET Numerics。关于 Math.NET Numerics Math.NET Numerics 是一个用于 .NET 平台的开源数学库，提供了以下功能： 线性代数（矩阵运算、求解线性方程组等）。数值计算（积分、微分、优化等&…...

编程日记 2025/8/20 4:42:23

NPM安装与配置全流程详解（2025最新版）

写目录一、环境准备与Node.js安装1. 下载Node.js（含NPM）2. 验证安装二、NPM核心配置优化1. 全局模块与缓存路径设置2. 镜像加速3. 代理配置（企业网络适用） 三、NPM基础操作指南1. 项目初始化2. 包管理命令3. 依赖锁定与版本管理…...

编程日记 2025/8/20 14:06:54

python-52-基于Langchain和Faiss实现向量存储和检索的技术原理

文章目录 1 文本加载与预处理1.1 计算文本的MD5哈希值1.2 加载文本并计算哈希2 初始化向量存储2.1 基于Ollama的嵌入模型2.2 获取code和id的对应关系2.3 清空索引向量2.4 基于HuggingFaceEmbeddings的嵌入模型2.4.1 将模型下载到本地2.4.2 使用方式3 添加新文本3.1 处理新文本并…...

编程日记 2025/8/18 9:54:17

游戏引擎学习第140天

回顾并为今天的内容做准备目前代码的进展到了声音混音的部分。昨天我详细解释了声音的处理方式，声音在技术上是一个非常特别的存在，但在游戏中进行声音混音的需求其实相对简单明了，所以今天的任务应该不会太具挑战性。今天我们会编写一个…...

编程日记 2025/8/18 7:40:44

Jetpack Navigation 实战：Fragment 和 Activity 的交互与导航

在 Android 开发中，使用 Jetpack Navigation 组件可以方便地管理 Fragment 和 Activity 之间的导航。以下是如何使用 Jetpack Navigation 实现 Fragment 之间、Activity 之间以及 Activity 与 Fragment 之间跳转的实战示例。 1. 添加依赖首先，在 build.…...

编程日记 2025/8/20 2:11:13

Linux中的基本指令（上）

目录 ls指令判断linux中文件 pwd指令认识路径编辑绝对路径/相对路径 cd指令简要理解用户理解家目录 echo指令和printf指令 touch指令 mkdir指令 cat指令 tree指令 rmdir指令和rm指令 man指令 cp指令 which指令 alias 指令 date指令 cal指令理解…...

编程日记 2025/8/19 2:30:19

多用户网页在线聊天室(测试报告)

文章目录多用户网页在线聊天室一，项目概括1.1 项目名称1.2 测试时间1.3 项目背景1.3 编写目的二，测试计划2.1 测试环境与配置2.2 测试用例2.3实际执行用例2.3.1登录2.3.2聊天消息列表展示2.3.3聊天消息详情页展示2.3.4联系人页展示2.3.5信息的编辑与发…...

编程日记 2025/8/15 22:18:09

字节青训营后端方向的个人总结（2025年3月4日）

字节青训营的结营总结（25寒假） ——致青训营队友的一封信明天就是大项目结项的日子了，不知道大家在这方面学习、精进了多少，也许有的朋友收获颇多并且已经完成了项目，我个人对此表示由衷的恭喜和祝贺。当初自告奋…...

编程日记 2025/8/18 3:03:32

VX iOS分析随记

断SVC的时候看调用栈，发现里面一个特别大的ollvm函数。vx版本8054 * thread #36, queue com.apple.root.default-qos, stop reason breakpoint 4.1 frame #0: 0x0000000111ad6124 WeChat___lldb_unnamed_symbol1315083 20 WeChat___lldb_unnamed_symbol13150…...

编程日记 2025/8/16 13:41:00

docker 小记

一、卸载查看当前版本 docker -v2. 如果有，先停止docker systemctl stop docker如果是yum安装，卸载方式为 #已防版本冲突，直接卸载 yum remove docker \docker-client \docker-client-latest \docker-common \docker-latest \docker-lat…...

编程日记 2025/8/19 16:14:34

AI代码编程辅助工具

现在AI火的一塌糊涂，作为技术应该更应该关注当前AI对编程行业的影响。分享下当前网络上最火的网络编程辅助工具。以下是个人搜集到的可以对编程起辅助作用的工具： 2025年最佳AI编程辅助工具 1. GitHub Copilot 这个工具也许你已经在使用了&#xff0…...

编程日记 2025/8/16 13:08:21

使用 kubectl cp 命令可以在 Kubernetes Pod 和本地主机之间拷贝文件或文件夹

使用 kubectl cp 命令可以在 Kubernetes Pod 和本地主机之间拷贝文件或文件夹 kubectl cp <namespace>/<pod-name>:<pod-path> <local-path> # 从 Pod 拷贝到本地 kubectl cp <local-path> <namespace>/<pod-name>:<pod-path&g…...

编程日记 2025/8/16 11:58:47

【eNSP实战】交换机配置端口隔离

交换机端口隔离可以实现在同一个VLAN内对端口进行逻辑隔离，端口隔离分为L2层隔离和L3层隔离，这里只进行L2层隔离演示。拓扑图路由器AR1配置GE 0/0/1配置IP，其余PC主机各自配置IP和网关。现将PC1到PC4四个主机全部进行L2层隔离&#xff0c…...

编程日记 2025/8/19 17:40:16

动态规划-第2篇

前言：在上一篇文章中，我们了解了动态规划的基本概念和解决问题的基本思路。通过分解问题、存储子问题的解，动态规划为我们提供了高效的解决方案。然而，动态规划并不是一成不变的，它有很多不同的技巧和变种，…...

编程日记 2025/8/18 2:29:30

数据库查问题常用OS命令汇总

1、内存使用情况查看 top //查看活跃进程占用情况 free -mh //查看操作系统当前可用内存 2、cpu使用情况 lscpu //查看os cpu情况 sar -u -f sar文件名 -s hh:mm:ss -e hh:mm:ss //查看对应日期的历史cpu情况 top //查看当前活跃进程使用cpu情况 3、io情况 iostat …...

编程日记 2025/8/16 1:14:56

基于springboot住院管理系统(源码+lw+部署文档+讲解)，源码可白嫖!

摘要随着世界经济信息化、全球化的到来和电子商务的飞速发展，推动了很多行业的改革。若想达到安全，快捷的目的，就需要拥有信息化的组织和管理模式，建立一套合理、畅通、高效的线上管理系统。当前的住院管理存在管理效率低下&…...

编程日记 2025/8/16 10:20:51

《用Python+PyGame开发双人生存游戏！源码解析+完整开发思路分享》

导语 "你是否想过用Python开发一款可玩性高的双人合作游戏？本文将分享如何从零开始实现一款类《吸血鬼幸存者》的生存射击游戏！包含完整源码解析、角色系统设计、敌人AI逻辑等核心技术点，文末提供完整代码包下载！" 哈…...

编程日记 2025/8/17 20:34:12

【ES6】在ES6中自定义数组

在ES6中是允许自定义类扩展基础类型的，因为这些基础类型是有构造函数的，在JS中类就是函数。 // 自定义数组 class myArray extends Array {constructor() {super();} }let arr new myArray();arr.push(1);console.log(arr);重写Array的原生方法 ES6的…...

编程日记 2025/8/19 21:43:31

软件开发项目有哪些风险

软件开发项目风险主要包括需求不明确、技术实现难度大、进度延误、成本超支、质量问题。其中，需求不明确可能导致功能设计反复修改；技术实现难度大会使开发过程中不断遇到未知挑战；进度延误常常因资源配置不足或变更频繁而发生；成…...

编程日记 2025/8/18 6:16:02