深入浅出理解ArrayBuffer对象TypedArray和DataView视图
目录
举例理解
1. ArrayBuffer对象
2. TypedArray
3. DataView
总结
具体讲解
1. ArrayBuffer对象
2. TypedArray
3. DataView
注意事项
举例理解
先举个简单的例子理解ArrayBuffer对象TypedArray和DataView视图的概念和之间的关系
1. ArrayBuffer对象
想象一个场景:你有一个装满水的长水管,这个水管就是一个
ArrayBuffer
。水管里的水是二进制数据,而水管本身则是用来存储这些数据的地方。特点:
- 固定长度:这个水管一旦制作好了,长度就不能再改变。
- 不能直接操作:你不能直接打开水管去喝水(即不能直接读取或修改二进制数据)。但是,你可以通过一些工具来帮助你。
2. TypedArray
继续上面的场景:现在,你想从水管里取水,但是水管太细了,手伸不进去。于是,你使用了一个特制的杯子(
TypedArray
),这个杯子有各种大小,可以对应水管里的不同水量。类型:
- Int8Array:像是一个小杯子,每次只能取8位(1字节)的水。
- Uint16Array:像是一个大杯子,每次可以取16位(2字节)的水。
- ……以此类推。
用途:
- 当你需要按照特定的量(类型)来取水(读取数据)或倒水(写入数据)时,就可以使用对应的杯子(
TypedArray
)。3. DataView
再次回到场景:但有时候,你可能想从水管的某个特定位置取一点水,或者同时取几种不同量的水。这时,使用杯子就不太方便了,因为杯子只能从头开始取水。
于是,你使用了一个吸管(
DataView
)。吸管可以让你选择从水管的哪个位置开始取水,以及取多少。特点:
- 灵活:你可以决定从水管的哪个位置开始,以及取多少水。
- 复杂:相对于杯子(
TypedArray
),使用吸管(DataView
)可能需要更多的技巧和注意。总结
ArrayBuffer
就像是一个装满水的长水管,用来存储二进制数据。TypedArray
就像是一个特制的杯子,用来按照特定的量(类型)来取水或倒水。DataView
则像是一个吸管,可以灵活地选择从水管的哪个位置开始取水,以及取多少。- 如果ArrayBuffer中存储的二进制类型单一使用TypedArray反之使用DataView
通过以上例子相信你已经大致了解了这三者之间的关系,接下来具体看一下
具体讲解
1. ArrayBuffer对象
用途与特性:
ArrayBuffer
对象是一个通用的、固定长度的原始二进制数据缓冲区。它常被用于存储和处理大量的二进制数据,比如图像、音频文件、网络通信中的数据等。
- 固定长度:一旦创建,
ArrayBuffer
的大小就不能改变。这意味着,你需要在创建时确定所需的缓冲区大小。- 不能直接操作:你不能直接读写
ArrayBuffer
的内容。相反,你需要通过某种类型数组对象(如TypedArray
)或DataView
对象来访问和修改其中的数据。创建与使用:
你可以使用
ArrayBuffer
构造函数来创建一个新的ArrayBuffer
对象,指定所需的字节长度作为参数。
const buffer = new ArrayBuffer(16); // 创建一个16字节的ArrayBuffer
2. TypedArray
用途与特性:
TypedArray
是一种特殊的数组,用于以特定的数值类型来读写ArrayBuffer
的内容。它提供了多种类型,如Int8Array
、Uint8Array
、Float32Array
等,用于存储不同范围和精度的数值。
- 与ArrayBuffer关联:
TypedArray
对象会关联一个ArrayBuffer
,并且其元素会对应到ArrayBuffer
的特定部分。- 类型安全:每个
TypedArray
都有一个固定的元素类型,这确保了存储的数据类型的一致性。创建与使用:
你可以通过传入一个
ArrayBuffer
对象来创建一个TypedArray
。
const buffer = new ArrayBuffer(16);
const int32View = new Int32Array(buffer); // 创建一个关联到buffer的Int32Array视图
你还可以使用
TypedArray
的.set()
方法来复制数据,或者使用.get()
方法来获取数据。3. DataView
用途与特性:
DataView
提供了一种用于读写ArrayBuffer
内容的低级接口。与TypedArray
不同,DataView
允许你以任意顺序和字节序来读写ArrayBuffer
的不同部分。
- 灵活性:你可以指定偏移量和字节序(大端或小端)来读取或写入数据。
- 低级操作:相比于
TypedArray
,DataView
提供了更底层的访问方式,但这也意味着操作起来可能更复杂一些。创建与使用:
你可以通过传入一个
ArrayBuffer
对象来创建一个DataView
。
const buffer = new ArrayBuffer(16);
const view = new DataView(buffer); // 创建一个关联到buffer的DataView
然后,你可以使用
DataView
提供的各种方法来读取或写入数据,如.getInt8()
、.setUint16()
等。注意事项
- 当使用
TypedArray
或DataView
来读写ArrayBuffer
时,要确保不要越界访问,否则可能会导致不可预测的行为。ArrayBuffer
、TypedArray
和DataView
共享相同的底层二进制数据。因此,对一个视图所做的修改会影响到其他视图和原始的ArrayBuffer
。- 当不再需要
ArrayBuffer
、TypedArray
或DataView
时,最好显式地解除对它们的引用,以便垃圾回收器能够回收它们占用的内存。
相关文章:
深入浅出理解ArrayBuffer对象TypedArray和DataView视图
目录 举例理解 1. ArrayBuffer对象 2. TypedArray 3. DataView 总结 具体讲解 1. ArrayBuffer对象 2. TypedArray 3. DataView 注意事项 举例理解 先举个简单的例子理解ArrayBuffer对象TypedArray和DataView视图的概念和之间的关系 1. ArrayBuffer对象 想象一个场景…...
人工智能 - 服务于谁?
人工智能服务于谁? 人工智能服务于生存,其最终就是服务于战争(热战、技术战、经济战) 反正就是为了活着而战的决策。 既然人工智能所有结果,来自大数据的分挖掘(分析)也就是数据的应用&#x…...
软考高级架构师:嵌入式系统的内核架构
作者:明明如月学长, CSDN 博客专家,大厂高级 Java 工程师,《性能优化方法论》作者、《解锁大厂思维:剖析《阿里巴巴Java开发手册》》、《再学经典:《Effective Java》独家解析》专栏作者。 热门文章推荐&am…...
分布式锁实战
4、分布式锁 4.1 、基本原理和实现方式对比 分布式锁:满足分布式系统或集群模式下多进程可见并且互斥的锁。 分布式锁的核心思想就是让大家都使用同一把锁,只要大家使用的是同一把锁,那么我们就能锁住线程,不让线程进行&#x…...
【VMware Workstation】启动虚拟机报错“此主机支持 AMD-V,但 AMD-V 处于禁用状态”
问题出现步骤: 打开虚拟机: 然后报错: “此主机支持 AMD-V,但 AMD-V 处于禁用状态。 如果已在 BIOS/固件设置中禁用 AMD-V,或主机自更改此设置后从未重新启动,则 AMD-V 可能被禁用。 (1) 确认 BIOS/固件设…...
非关系型数据库(缓存数据库)redis的基础认知与安装
目录 一.关系型数据库和非关系型数据库 关系型数据库 非关系型数据库 关系数据库与非关系型数据库的区别 ①非关系数据 关系型数据库 非关系型数据库产生背景 数据存储流向 非关系型数据库 关系数据库 二.redis的简介 1.概念 2.Redis 具有以下几个优点: 3.Redi…...
Go语言如何处理文件
1.文件的重要性 文件不过是硬盘中的数据,看起来好像没什么了不起,但实际上,文件能够让程序员管理配置、存储程序的状态乃至从底层操作系统中读取数据。 UNIX型操作系统的一个重要特征是,将一切都视为文件。这意味着在操作系统看来,从键盘到打印机的所有东西都可像文件那样…...
Java基础知识总结(42)
(1)Java关键字的相关知识进行了复习 考试过程中“main”是主方法名,而不是Java关键字 (2)类型转换 当一个算术表达式中包含多个基本类型的值时,整个算术表达式的数据类型将发生自动提升,所有的b…...
C++ | Leetcode C++题解之第6题Z字形变换
题目: 题解: class Solution { public:string convert(string s, int numRows) {int n s.length(), r numRows;if (r 1 || r > n) {return s;}string ans;int t r * 2 - 2;for (int i 0; i < r; i) { // 枚举矩阵的行for (int j 0; j i &l…...
JavaEE——手把手教你实现简单的 servlet 项目
文章目录 一、什么是 Servlet二、创建一个简单的 Servlet 程序1. 创建项目2.引入依赖3. 创建目录4.编写代码5. 打包程序6. 部署7.验证整体过程总结 三、使用 Smart Tomcat 插件简化项目创建四、创建项目时可能遇到的几个问题。 一、什么是 Servlet Servlet 是一种实现 动态页面…...
X年后,ChatGPT会替代底层程序员吗?
能不能替代,真的很难说,因为机器换掉人,这其实是一个伦理问题。 其实说白了,任何行业在未来都会被AI或多或少的冲击到,因为ChatGPT做为一个可以持续提升智能的AI,在某些方面的智能程度超过人类并不是什么难…...
OpenAI 推出新网络爬虫GPTBot,为GPT-5做准备
目录 一、GPTBot是什么?它是如何工作的?二、GPTBot 与 Google Bot 等搜索引擎网络爬虫有何不同?三、GPTBot 与 Perplexity AI 的网络爬虫有何不同?四、允许 GPTBot 爬取有哪些风险和好处?4.1 允许 GPTBot 的好处4.2 允…...
【Easy云盘 | 第二篇】后端统一设计思想
文章目录 4.1后端统一设计思想4.1.1后端统一返回格式对象4.1.2后端统一响应状态码4.1.3后端统一异常处理类4.1.4StringUtils类4.1.5 RedisUtils类 4.1后端统一设计思想 4.1.1后端统一返回格式对象 com.easypan.entity.vo.ResponseVO Data public class ResponseVO<T> …...
c语言:模拟字符串拷贝功能(strcpy),面试题
面试题:优化中的优化(10分满分) 字符串拷贝:是将一个字符串的内容复制到另一个字符串中的操作。 运用函数模拟字符串拷贝:(5分) 模拟字符串拷贝 #include <stdio.h> void my_strcpy(char* dest, c…...
信创环境ES索引管理脚本:close, delete
背景 elastic-curator在信创环境无现成安装包,且现成一般无法联网,此时通过脚本管理es索引是最佳选择。 1, 脚本内容: es-close-del.sh [rootmyprojtest001 ]# cat es-close-del.sh #/bin/bash#elastic地址 ELASTIC_URL127.0.0.1:9200 #默认的删除时间…...
torch-v1.3.1-build
编译pytorch-v1.3.1 python版本>3.8会收到报错 error: cannot convert ‘std::nullptr_t’ to ‘Py_ssize_t’ {aka ‘long int’} in initialization, 参见: https://github.com/pytorch/pytorch/issues/28060 简单办法是用python3.7 wget https://mirrors.tuna.tsingh…...
C语言宏定义笔记
把宏名全部大写,函数名不要全部大写。注意宏定义表示数据类型和用 typedef 定义数据说明符的区别。宏定义只是简单的字符串替换,由预处理器来处理; typedef 是在编译阶段由编译器处理的,它并不是简单的字符串替换,而给…...
设计模式:生活中的观察者模式
想象你在社交媒体上关注(订阅)了一个名人或新闻频道(主题)。一旦他们发布新内容,所有关注者(观察者)都会收到通知。这个过程就很像观察者模式的工作原理。 生活场景类比 主题(Subj…...
Qt实现Kermit协议(四)
3 实现 3.3 KermitRecvFile 该模块实现了Kermit接收文件功能。 序列图如下: 3.3.1 KermitRecvFile定义 class QSerialPort; class KermitRecvFile : public QObject, public Kermit {Q_OBJECT public:explicit KermitRecvFile(QSerialPort *serial, QObject *…...
苏州金龙助力旅游客运加速蜕变
近日,北京铭悦旅游客运有限公司又迎来一批苏州金龙海格纯电动客车。(以下简称北京铭悦旅游)总经理郭保生在车辆交付时说到,“为迎接强劲复苏的旅游市场,要求旅游客运向绿色客运转型,以及人民对品质生活、美…...
头盔检测 | 基于Caffe-SSD目标检测算法实现的建筑工地头盔检测
项目应用场景 面向建筑工地头盔检测场景,使用深度学习 Caffe SSD 目标检测算法,基于 C 实现。 项目效果 项目细节 > 具体参见项目 README.md (1) 安装 Caffe SSD(2) 执行训练 sh examples/Hardhat/SSD300/train_SSD300.sh (3) 部署算法 项目获取 h…...
Stable diffusion 加载扩展列表报错解决方法
项目场景: 在使用Stable diffusion webui时,使用扩展列表出现错误 问题描述 点击loadfrom后,出现加载扩展列表报错 原因分析: 下载的扩展的时候,都是github 的url,需要科学上网,如果不能科学…...
Git(8)之分支间同步特定提交
Git(8)之分支间同步特定提交 Author:Once Day Date:2024年4月7日 漫漫长路有人对你微笑过嘛… 全系列文章可查看专栏: Git使用记录_Once_day的博客-CSDN博客 文章目录 Git(8)之分支间同步特定提交1. 分支间同步提交2. cherry-pick同步分支间的特定提交…...
万得AI算法工程师一面面试题6道|含解析
节前,我们星球组织了一场算法岗技术&面试讨论会,邀请了一些互联网大厂朋友、参加社招和校招面试的同学,针对算法岗技术趋势、大模型落地项目经验分享、新手如何入门算法岗、该如何准备、面试常考点分享等热门话题进行了深入的讨论。 今天…...
蓝桥杯23年第十四届省赛-异或和之和|拆位、贡献法
题目链接: 蓝桥杯2023年第十四届省赛真题-异或和之和 - C语言网 (dotcpp.com) 1.异或和之和 - 蓝桥云课 (lanqiao.cn) 参考题解: 蓝桥杯真题讲解:异或和之和 (拆位、贡献法)-CSDN博客 洛谷P9236 [蓝桥杯 2023 省 A]…...
Unity进阶之路(1)回顾与思考
首先呢,博主在这里先反思一下自己这几个月,其实并没有多少进步。 在寒假中,博主几乎是独立编写了一个小程序的完整UI和一个Uniapp的雏形。那段时间是博主生产力最高的时间段。几乎是每天8点起来开始编写代码,晚上一直忙到很晚。 …...
【C语言】——指针八:指针运算笔试题解析
【C语言】——指针八:指针运算笔试题解析 一、题一二、题二三、题三四、题四五、题五六、题六七、题七 一、题一 //程序输出结果是什么 int main() {int a[5] { 1,2,3,4,5 };int* ptr (int*)(&a 1);printf("%d, %d", *(a 1), *(ptr - 1));return…...
JVM字节码与类的加载——class文件结构
文章目录 1、概述1.1、class文件的跨平台性1.2、编译器分类1.3、透过字节码指令看代码细节 2、虚拟机的基石:class文件2.1、字节码指令2.2、解读字节码方式 3、class文件结构3.1、魔数:class文件的标识3.2、class文件版本号3.3、常量池:存放所…...
小程序如何通过公众号发送新订单提醒
当客户在小程序上下单后,公众号会发送订单通知,这可以让管理员及时获知用户下单情况,方便及时处理订单和提供服务。下面是具体介绍如何设置公众号来发送订单服务通知。 方式一:通过采云公众号发送订单通知 此种方式是默认的通知…...
聊聊公众号最让我不爽的两个痛点
本文首发于 Python猫 微信公众号最让我不爽的地方有两个,而且有很多人虽然也不爽,却不知道原因。 本文想聊聊公众号的两个痛点,因为我经常收到私信问这两个问题,本文算是一次集中的回复吧。 第一个不爽的点是公众号会屏蔽外链&…...
网页模版素材下载/广州抖音seo公司
厨房的烟道可不是那么容易就能改的,在该烟道前就一定要征得物业的同意,还有一定的安全问题,再不然还会引发邻里的会见的矛盾。那么厨房的烟道可以改吗?一起来看看装一网小编给各位整理的一些关于改烟道的相关注意事项吧࿰…...
松江品划做企业网站/公司官网怎么制作
tomcat在jvm提供的类加载器上进行了扩展,并且打破了双亲委托机制CommonClassLoader、CatalinaClassLoader、SharedClassLoader和WebappClassLoader则是Tomcat自己定义的类加载器,它们分别加载/common/*、/server/*、/shared/*(在tomcat 6之后已经合并到根…...
网站开发个人所得税/南宁seo排名优化
从国足1:5输泰国看项目管理之项目失败责任该有谁负 作者:张子良 版权所有,转载请注明出处 引子 中国足球又输球了,输球不是新闻,1:5输给泰国才是新闻,而这次输球也必将成为中国足球的一个分水岭。是足协的问题…...
广州专业网站建设网页设计服务/百度收录网站多久
在 -Webserver1配置workplace join 在 -Webserver1配置workplace join 1. 点击 添加角色和功能 2. 点击 下一步 3. 点击 下一步 4. 点击 下一步 5. 勾选 WEB服务器,点击 下一步 6. 勾选 windows identity foundation3.5,点击 下一步 7. 点击 下一步 8. 勾选 …...
没有网站如何做cpa/深圳app推广平台
疑难杂症 该画廊特效的特点就是前后元素有层级关系。 我想很多人应该看过或者用过这个插件carousel.js,网上也有相关的教程。不知道这个插件的原型是哪个,有知道的朋友可以告诉我。 该插件相对完美,但是实际在项目中使用时却发现了一个令人…...
规划网站的总结/想学手艺在哪里可以培训
登录JIRA访问打开缓慢,查询日志出现下述提示:java.lang.OutOfMemoryError: GC overhead limit exceeded 修改setenv.sh文件中的JVM配置,/data/atlassian/jira/bin 是我JIRA安装的路径 #cd /data/atlassian/jira/bin #vi setenv.sh 编辑保存后…...