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

JavaScript:二进制数组【笔记】

二进制数组【ArrayBuffer对象、Type的Array视图和DataView视图】JavaScript操作二进制数据的一个接口。

这些接口原本是和WebGL有关【WebGL是浏览器与显卡之间的通信接口】,为了满足JavaScript与显卡之间大量、实时数据交换,那么JavaScript和显卡之间的数据通信必须是二进制。不能是传统的文本格式。

所谓的文本格式,就是传递一个32位整数,两端的JavaScript和显卡都要进行数据格式化,这样非常耗时。

二进制数组,就是想C语言那样直接操作字节,把4个字节的32位整数以二进制的形式传给显卡,这样脚本的性能大幅提升。

二进制数组有三类对象组成:

  1. ArrayBuffer对象:表示内存中的一段二进制数据,通过视图来进行操作。视图添加了数组接口,这样就可以使用数组的方法来操作内存了。
  2. TypedArray视图:有9种类型的视图,例如:Uint8Array数组视图、Int16Array数组视图、Float32Array数组视图。
  3. DataView视图:可以自定义复合格式的视图或者自定义字节序。

总结:ArrayBuffer对象是二进制数据、TypedArray视图用来读写简单类型的二进制数据、DataView视图用于读写复杂类型的二进制数据。

支持TypedArray视图的9种数据类型:

  1. Int8,1个字节长度,8为带符号的整数;
  2. Uint8,1个字节长度,8位不带符号的整数;
  3. Uint8C,1个字节长度,8位不带符号的整数【自动过滤溢出】;
  4. Int16,2个字节长度,16位带符号的整数;
  5. Uint16,2个字节长度,16位不带符号的整数;
  6. Int32,4个字节长度,32位带符号的整数;
  7. Uint32,4个字节长度,32位不带符号的整数;
  8. Float32,4个字节长度,32位浮点数;
  9. Float64,8个字节长度,64位浮点数;

ArrayBuffer对象

ArrayBuffer对象是存储二进制数据的一段内存,但是不能读和写。

ArrayBuffer是一个构造函数,分配一段可以存储数据的连续内存区域。比如:

let  buffer = new ArrayBuffer(32);

这样就创建一段32字节的内存区域,每一个字节默认值为0。

为了读写这段内存,就需要指定视图,比如DataView视图,代码如下:

let buffer = new ArrayBuffer(32);
let dataView = new DataView(buffer);

打印dataView的结果如下:
在这里插入图片描述

let x = new Int16Array(buffer);
console.log(x)

在这里插入图片描述

当两个视图对应同一段内存的时候,一个视图的修改会影响到另一个视图。

ArrayBuffer.prototype.byteLength

ArrayBuffer实例的byteLength属性返回的是内存的字节长度。

ArrayBuffer.prototype.slice():内存分割;
ArrayBuffer.isView():判断参数是否是ArrayBuffer的视图实例;

TypedArray视图

TypedArray视图有9中类型:

  1. Int8Array:8位有符号整数,长度为1个字节;
  2. Uint8Array:8位无符号整数,长度为1个字节
  3. Uint8ClampedArray:8位无符号整数,长度为1个字节,溢出处理不同
  4. Int16Array:16位有符号整数,长度为2个字节
  5. Uint16Array:16位无符号整数,长度为2个字节
  6. Int32Array:32位有符号整数,长度为4个字节
  7. Uint32Array:32位无符号整数,长度为4个字节
  8. Float32Array:32位浮点数,长度为4个字节
  9. Float64Array:64位浮点数,长度为8个字节。

相关文章:

JavaScript:二进制数组【笔记】

二进制数组【ArrayBuffer对象、Type的Array视图和DataView视图】JavaScript操作二进制数据的一个接口。 这些接口原本是和WebGL有关【WebGL是浏览器与显卡之间的通信接口】,为了满足JavaScript与显卡之间大量、实时数据交换,那么JavaScript和显卡之间的…...

华为云认证考试包含哪些内容?

华为云计算认证考试包含哪些内容?华为云计算认证涵盖了hcia、HCIP、HCIE三个级别的认证。HCIA云计算方向只要考一门笔试,考试覆盖基础通识知识、虚拟化FusionCompute、桌面云FusionAccess、云计算发展趋势共四大模块知识点,包括云计算概述、服…...

进程程序替换

✅<1>主页&#xff1a;&#xff1a;我的代码爱吃辣 &#x1f4c3;<2>知识讲解&#xff1a;Linux——进程替换 ☂️<3>开发环境&#xff1a;Centos7 &#x1f4ac;<4>前言&#xff1a;我们创建子进程的目的是什么&#xff1f;想让子进程帮我们执行特定的…...

理解HTTPS/TLS/SSL(二)可视化TLS握手过程并解密加密数据

文章目录 WireShark抓包TLS握手过程Client HelloServer HelloEncryped Extenstions, Certificate, Certificate VerifyChange Ciper Spec, FinshedTLS 1.2和TLS 1.3的区别能不能在进一步&#xff1f; 解密WireShark中抓到的TLS包参考资料 上一篇文章已经在本地使用了生成自签名…...

一文详解TCP三次握手四次挥手

文章目录 TCP的三次握手和四次挥手三次握手四次挥手 TCP的三次握手和四次挥手 基本概念 SYN&#xff08;Synchronize Sequence Numbers&#xff0c;同步序列数字&#xff09;&#xff1a;用于建立连接的同步信号。 SYN 序列号的作用是用于标识每个数据包中的字节流的起始位置。…...

PDF怎么转图片?四种转换方法分享

PDF文件是一种非常常见的文档格式&#xff0c;然而&#xff0c;有时候我们需要将PDF文件转换成图片格式。比如我们可能需要将PDF文件中的某些页面或图表转换成图片格式以便于编辑或分享。在这篇文章中&#xff0c;我们将介绍四种将PDF文件转换成图片的方法。 方法一&#xff1a…...

华为OD机试 - 压缩报文还原 - 正则表达式(Java 2023 B卷 100分)

目录 专栏导读一、题目描述二、输入描述三、输出描述四、解题思路五、Java算法源码六、效果展示1、输入2、输出3、说明 华为OD机试 2023B卷题库疯狂收录中&#xff0c;刷题点这里 专栏导读 本专栏收录于《华为OD机试&#xff08;JAVA&#xff09;真题&#xff08;A卷B卷&#…...

电商API的应用价值:淘宝1688京东API接口系列

API接口是一种软件应用程序&#xff0c;它充当两个不同软件应用程序之间的中介。它帮助不同的应用程序相互通信&#xff0c;共享数据&#xff0c;从而使用户能够完成不同的任务。API接口的用途非常广泛&#xff0c;下面是一些常见的用途&#xff1a; 数据共享&#xff1a;API接…...

day38 代码回想录 斐波那契数爬楼梯使用最小花费爬楼梯

大纲 ● 理论基础 ● 509. 斐波那契数 ● 70. 爬楼梯 ● 746. 使用最小花费爬楼梯 509. 斐波那契数 题目&#xff1a;509. 斐波那契数 // 斐波那契数列 // 动规 5部曲 // 1 dp[i]代表i处的斐波那契值 // 2 递归公式&#xff1a;dp[0] 0, dp[1]1, dp[i]dp[i-1]dp[i-2] // 3…...

Flink DataStream 体系

前言 本文隶属于专栏《大数据技术体系》&#xff0c;该专栏为笔者原创&#xff0c;引用请注明来源&#xff0c;不足和错误之处请在评论区帮忙指出&#xff0c;谢谢&#xff01; 本专栏目录结构和参考文献请见大数据技术体系 思维导图 正文 对 Flink 这种以流为核心的分布式计…...

Linux的调试工具 - gdb(超详细)

Linux的调试工具 - gdb 1. 背景2. 开始使用指令的使用都用下面这个C语言简单小代码来进行演示&#xff1a;1. list或l 行号&#xff1a;显示文件源代码&#xff0c;接着上次的位置往下列&#xff0c;每次列10行。2. list或l 函数名:列出某个函数的源代码。3. r或run: 运行程序。…...

已知平面内三点,求其平面的法向量

三点平面法向量 设三点坐标为A(x1,y1,z1),B(x2,y2,z2),C(x3,y3,z3) 向量AB(x2-x1,y2-y1,z2-z1),AC(x3-x1,y3-y1,z3-z1) AB、AC所在平面的法向量即ABAC(a,b,c),其中&#xff1a; a(y2-y1)(z3-z1)-(z2-z1)(y3-y1) b(z2-z1)(x3-x1)-(z3-z1)(x2-x1) c(x2-x1)(y3-y1)-(x3-x1)(y2-y1)…...

HTML

HTML 1.HTML结构 1.1认识HTML HTML是超文本标记语言&#xff0c;电脑上看到的所有网站都是html实现的 HTML代码是“标签”构成的&#xff0c;简单来说&#xff0c;html就是一堆标签的组合 形如 <body>hello</body>标签名 (body) 放到 < > 中 大部分标签成…...

Java手写最大子数组和算法(如Kadane算法)和最大子数组和算法(如Kadane算法)应用拓展案例

Java手写最大子数组和算法&#xff08;如Kadane算法&#xff09;和最大子数组和算法&#xff08;如Kadane算法&#xff09;应用拓展案例 1. 算法思维导图 以下是使用mermaid代码表示的Kadane算法的实现原理&#xff1a; #mermaid-svg-rI7hVAVsP1qtjZK7 {font-family:"tr…...

掌握NVM、NRM和NPM:Node.js开发的利器

**掌握NVM、NRM和NPM&#xff1a;Node.js开发的利器** 背景介绍&#xff1a;如何使用NVM&#xff1a;在Windows上安装NVM&#xff1a;在macOS上安装NVM&#xff1a;配置NVM&#xff1a;常用NVM命令&#xff1a; 如何使用NRM&#xff1a;安装NRM&#xff1a;配置全局NRM&#xf…...

Nacos 2.2.3 部署到linux

到https://github.com/alibaba/nacos/releases 下载编译后压缩包&#xff0c;如nacos-server-2.2.3.tar.gz这种&#xff0c;里面包含有nacos的jar包&#xff0c;不然启动不了 1.新建并初始化数据库 创建nacos数据库&#xff0c;执行mysql-schema.sql文件&#xff0c;这个文件…...

设计模式之十:状态模式

状态模式通过改变对象内部的状态来帮助对象控制自己的行为。 这是一张状态图&#xff0c;其中每个圆圈都是一个状态。 最简单&#xff0c;第一反应的实现就是使用一个变量来控制状态值&#xff0c;并在方法内书写条件代码来处理不同情况。 package headfirst.designpatterns.…...

Python 的运算符和语句(条件、循环、异常)基本使用指南

运算符的分类 算数运算符赋值运算符复合赋值运算符比较运算符逻辑运算符 算数运算符 运算符描述实例加1 1 输出结果为 2-减1 - 1 输出结果为 0*乘2 * 2 输出结果为 4/除10 / 2 输出结果为 5//整除9 // 4 输出结果为 2%取余9 % 4 输出结果为 1**指数2 ** 4 输出结果为 16&…...

文心一言 VS 讯飞星火 VS chatgpt (94)-- 算法导论9.2 3题

三、用go语言&#xff0c;给出 RANDOMIZED-SELECT的一个基于循环的版本。 文心一言&#xff1a; 在循环中实现 RANDOMIZED-SELECT 的一个版本可以如下所示。这个版本使用 Go 语言编写&#xff0c;利用随机化来选择一个元素&#xff0c;并在循环中不断地调整选择的元素&#x…...

React中组件通信01——props

React中组件通信01——props 1. 父传子——props1.1 简单例子——props1.2 props 可以传递任何数据1.2.1 传递数字、对象等1.2.2 传递函数1.2.3 传递模版jsx 2. 子传父 子传子——props2.1 父传子——传递函数2.2 子传父——通过父传子的函数实现2.3 优化 子传子&#xff08;…...

Python:操作 Excel 折叠

💖亲爱的技术爱好者们,热烈欢迎来到 Kant2048 的博客!我是 Thomas Kant,很开心能在CSDN上与你们相遇~💖 本博客的精华专栏: 【自动化测试】 【测试经验】 【人工智能】 【Python】 Python 操作 Excel 系列 读取单元格数据按行写入设置行高和列宽自动调整行高和列宽水平…...

基于Flask实现的医疗保险欺诈识别监测模型

基于Flask实现的医疗保险欺诈识别监测模型 项目截图 项目简介 社会医疗保险是国家通过立法形式强制实施&#xff0c;由雇主和个人按一定比例缴纳保险费&#xff0c;建立社会医疗保险基金&#xff0c;支付雇员医疗费用的一种医疗保险制度&#xff0c; 它是促进社会文明和进步的…...

dedecms 织梦自定义表单留言增加ajax验证码功能

增加ajax功能模块&#xff0c;用户不点击提交按钮&#xff0c;只要输入框失去焦点&#xff0c;就会提前提示验证码是否正确。 一&#xff0c;模板上增加验证码 <input name"vdcode"id"vdcode" placeholder"请输入验证码" type"text&quo…...

第一篇:Agent2Agent (A2A) 协议——协作式人工智能的黎明

AI 领域的快速发展正在催生一个新时代&#xff0c;智能代理&#xff08;agents&#xff09;不再是孤立的个体&#xff0c;而是能够像一个数字团队一样协作。然而&#xff0c;当前 AI 生态系统的碎片化阻碍了这一愿景的实现&#xff0c;导致了“AI 巴别塔问题”——不同代理之间…...

html css js网页制作成品——HTML+CSS榴莲商城网页设计(4页)附源码

目录 一、&#x1f468;‍&#x1f393;网站题目 二、✍️网站描述 三、&#x1f4da;网站介绍 四、&#x1f310;网站效果 五、&#x1fa93; 代码实现 &#x1f9f1;HTML 六、&#x1f947; 如何让学习不再盲目 七、&#x1f381;更多干货 一、&#x1f468;‍&#x1f…...

嵌入式学习笔记DAY33(网络编程——TCP)

一、网络架构 C/S &#xff08;client/server 客户端/服务器&#xff09;&#xff1a;由客户端和服务器端两个部分组成。客户端通常是用户使用的应用程序&#xff0c;负责提供用户界面和交互逻辑 &#xff0c;接收用户输入&#xff0c;向服务器发送请求&#xff0c;并展示服务…...

C/C++ 中附加包含目录、附加库目录与附加依赖项详解

在 C/C 编程的编译和链接过程中&#xff0c;附加包含目录、附加库目录和附加依赖项是三个至关重要的设置&#xff0c;它们相互配合&#xff0c;确保程序能够正确引用外部资源并顺利构建。虽然在学习过程中&#xff0c;这些概念容易让人混淆&#xff0c;但深入理解它们的作用和联…...

从 GreenPlum 到镜舟数据库:杭银消费金融湖仓一体转型实践

作者&#xff1a;吴岐诗&#xff0c;杭银消费金融大数据应用开发工程师 本文整理自杭银消费金融大数据应用开发工程师在StarRocks Summit Asia 2024的分享 引言&#xff1a;融合数据湖与数仓的创新之路 在数字金融时代&#xff0c;数据已成为金融机构的核心竞争力。杭银消费金…...

认识CMake并使用CMake构建自己的第一个项目

1.CMake的作用和优势 跨平台支持&#xff1a;CMake支持多种操作系统和编译器&#xff0c;使用同一份构建配置可以在不同的环境中使用 简化配置&#xff1a;通过CMakeLists.txt文件&#xff0c;用户可以定义项目结构、依赖项、编译选项等&#xff0c;无需手动编写复杂的构建脚本…...

大数据治理的常见方式

大数据治理的常见方式 大数据治理是确保数据质量、安全性和可用性的系统性方法&#xff0c;以下是几种常见的治理方式&#xff1a; 1. 数据质量管理 核心方法&#xff1a; 数据校验&#xff1a;建立数据校验规则&#xff08;格式、范围、一致性等&#xff09;数据清洗&…...