uni-app x UTS 内置对象 Float32Array 完全指南：构造、静态 API 与实例方法实战

uni-app x UTS 内置对象 Float32Array 完全指南构造、静态 API 与实例方法实战【免费下载链接】uni-appA cross-platform framework using Vue.js项目地址: https://gitcode.com/gh_mirrors/un/uni-appFloat32Array 是 UTSuni type script内置的类型化数组TypedArray对象用于在 uni-app 与 uni-app x 中高效读写 32 位单精度浮点数二进制数据。本文以 Float32Array 官方文档 为主线结合 hello-uts 示例仓库 中的完整测试用例系统讲解其三种构造函数、静态属性与方法、全部实例方法及跨平台兼容性帮助开发者直接落地到二进制协议解析、音频/传感器数据流处理等实战场景。UTS 与类型化数组为什么需要 Float32ArrayUTS 是一门可编译为 JavaScriptWeb/小程序、KotlinAndroid、SwiftiOS、ArkTSHarmonyOS的跨平台强类型语言其语法与 TypeScript 基本一致详见 UTS 介绍。为了在各原生平台上提供统一的二进制操作能力UTS 内置了与 ES6 一致的 TypedArray 体系Float32Array 正是其中的浮点类型成员。在 UTS 中ArrayBuffer代表原始字节缓冲区不能直接读写其内容必须通过类型化数组视图来操作参见 字节数组ArrayBuffer。Float32Array 即是以 4 字节单精度 IEEE 754 浮点为元素单元、按索引读写缓冲区内容的视图const buffer new ArrayBuffer(8); const view new Float32Array(buffer); // 8 字节可容纳 2 个 float32 元素 view[0] 1.5; console.log(view[1]); // 0未赋值元素默认填充 0从源码结构看hello-uts 示例在 SyntaxCase 页面 中演示了同一 ArrayBuffer 分别挂载Uint8Array、Float32Array、Float64Array等视图的场景说明 TypedArray 家族在二进制数据处理上是相互配合的一整套 API。构造函数三种初始化方式Float32Array 提供三个重载构造函数对应按长度分配、从数据拷贝、挂载既有缓冲区三种典型需求。new(length : number)以数字length为元素个数创建数组内部会分配一个大小为length × BYTES_PER_ELEMENT字节的缓冲区并以 0 填充省略所有参数等价于传入0。| 名称 | 类型 | 必填 | 描述 | | :- | :- | :- | :- | | length | number | 是 | 类型化数组的元素个数非字节数 |uni-app x 兼容性Web √、Android 4.25、iOS 4.11、HarmonyOS 4.61、iOS(VDOM) UTS 插件 4.51uni-app 兼容性Android UTS 插件 √、iOS UTS 插件 4.51、HarmonyOS UTS 插件 √。let float32 new Float32Array(2); float32[0] 42; console.log(float32.length); // 2new(array : ArrayLikenumber | ArrayBufferLike)传入另一个 TypedArray 实例或类数组对象时会将其中的每个值拷贝并转换为新数组元素新数组长度与入参一致。注意 bigint 类型数组BigInt64Array/BigUint64Array与非 bigint 类型数组之间不可混用。| 名称 | 类型 | 必填 | 描述 | | :- | :- | :- | :- | | array | ArrayLikenumber | ArrayBufferLike | 是 | 待拷贝的类数组或类型化数组 |uni-app x 兼容性Web √、Android 4.25、iOS √、HarmonyOS 4.61、iOS(VDOM) UTS 插件 4.51uni-app 兼容性Android UTS 插件 √、iOS UTS 插件 4.51、HarmonyOS UTS 插件 √。let x new Float32Array([21, 31, 3]); let y new Float32Array(x); // 拷贝 xy[0] 21new(buffer : ArrayBufferLike, byteOffset?, length?)直接为既有 ArrayBuffer 创建视图byteOffset单位字节与length元素个数指定视图暴露的内存范围。两者均省略时视图覆盖整个缓冲区仅省略length时覆盖从byteOffset到缓冲区末尾的部分。| 名称 | 类型 | 必填 | 描述 | | :- | :- | :- | :- | | buffer | ArrayBufferLike | 是 | ArrayBuffer 实例 | | byteOffset | number | 否 | 偏移量单位字节 | | length | number | 否 | 元素个数 |uni-app x 兼容性Web √、Android 4.25、iOS 4.11、HarmonyOS 4.61、iOS(VDOM) UTS 插件 4.51uni-app 兼容性Android UTS 插件 √、iOS UTS 插件 4.51、HarmonyOS UTS 插件 √。let buffer new ArrayBuffer(16); let z new Float32Array(buffer, 2, 4); // 从第 2 字节起4 个元素 console.log(z.byteOffset); // 2 console.log(z.length); // 4参数类型 ArrayBufferLike 的成员当使用第三种构造方式时buffer参数要求是 ArrayBufferLike其含以下成员byteLength属性number必读缓冲区字节长度。兼容性Web √、Android 4.25、iOS 4.11、HarmonyOS 4.61。slice(begin?, end?) : ArrayBuffer返回从begin含到end不含的字节副本。begin/end均支持负数索引从末尾倒推begin为负且小于-buffer.length时按 0 处理end省略或大于等于缓冲区长度时取到末尾若标准化后的end在start之前则返回空缓冲区。兼容性Web √、Android 4.25、iOS 4.11、HarmonyOS 4.61。返回类型为 ArrayBuffer。toByteBuffer() : ByteBuffer返回 Android 原生ByteBuffer对象仅 Android 4.25 支持Web/iOS/HarmonyOS 为 x。toData() : Data返回 iOS 原生Data对象当前各平台兼容性均标记为 x需按平台实际版本验证。以下测试用例源自 TFloat32Array.uts演示了slice与视图的组合使用先向Float32Array的第 4 个元素写入 42再从缓冲区第 8 字节起切片最后用新视图读回该值let buffer new ArrayBuffer(16); let float32 new Float32Array(buffer); float32[3] 42; console.log(float32.toString()); // 0,0,0,42 let res buffer.slice(8); let sliced new Float32Array(res); console.log(sliced[1]); // 42静态属性与静态方法BYTES_PER_ELEMENT每个元素占用的字节数Float32Array 恒为 4。它既是静态属性也是实例属性可用于动态计算缓冲区大小console.log(Float32Array.BYTES_PER_ELEMENT); // 4uni-app x 兼容性Web √、Android 4.25、iOS 4.11、HarmonyOS 4.61、iOS(VDOM) UTS 插件 4.51uni-app 兼容性Android UTS 插件 √、iOS UTS 插件 4.51、HarmonyOS UTS 插件 √。of(...items) : Float32Array以一组元素直接创建数组参数类型为number[]。测试用例TFloat32Array.uts验证了其行为var float32Array Float32Array.of(1, 2, 3) console.log(float32Array.toString()); // 1,2,3from(arrayLike, mapFn?) : Float32Array从类数组或可迭代对象创建数组。类数组需满足length: number与[n: number]: number两个要求可选的mapFn: (v: number, k: number) number会对每个元素先加工再写入结果。var float32Array Float32Array.from([1, 2, 3], (v: number, _: number): number v v); console.log(float32Array.toString()); // 2,4,6两种静态方法的兼容性与BYTES_PER_ELEMENT完全一致。实例属性| 属性 | 说明 | | :- | :- | | BYTES_PER_ELEMENT | 每个元素字节数4 | | buffer | 视图所引用的底层 ArrayBuffer | | byteLength | 视图占用缓冲区的字节长度 | | byteOffset | 视图在缓冲区中的起始字节偏移 | | length | 视图的元素个数 byteLength / BYTES_PER_ELEMENT |其中buffer、byteLength、byteOffset在文档中以 UTSJSON 占位形式存在语义与 ES 标准一致byteLength始终是BYTES_PER_ELEMENT的整数倍byteOffset byteLength不会越过底层缓冲区的byteLength。测试用例TFloat32Array.uts对length、BYTES_PER_ELEMENT、byteOffset均有断言验证。实例方法全览与实战示例以下方法均与 ES 类型化数组语义一致回调节点签名统一为(value: number, index: number, array: Float32Array)。查询与判定every / filter / find / findIndex / some / indexOf / includesevery(predicate) : boolean所有元素满足条件返回 truelet result new Float32Array([12, 5, 8, 130, 44]).every((value: number, _: number, _a: Float32Array): boolean value 40); console.log(result); // false44 不小于 40filter(predicate) : Float32Array返回满足条件的元素组成的新数组let float32 new Float32Array([12, 5, 8, 44]).filter((value: number, _: number, _a: Float32Array): boolean value 10); console.log(float32.toString()); // 12,44find(predicate) : number返回第一个满足条件的元素无则返回 undefinedlet float32 new Float32Array([4, 5, 8, 12]); let res float32.find((value: number, _: number, _a: Float32Array): boolean value 5); console.log(res); // 8findIndex(predicate) : number返回第一个满足条件的元素下标无则返回 -1let float32 new Float32Array([4, 6, 7, 120]); let res float32.findIndex((value: number, _: number, _a: Float32Array): boolean value 100); console.log(res); // 3some(predicate) : boolean任一元素满足条件返回 trueconst float32 new Float32Array([-10, 20, -30, 40, -50]); console.log(float32.some((element: number, index: number, array: Float32Array): boolean element 0)); // trueindexOf(searchElement, fromIndex?) : number从fromIndex支持负数开始查找元素下标未找到返回 -1let float32 new Float32Array([2, 5, 9]); console.log(float32.indexOf(2)); // 0 console.log(float32.indexOf(7)); // -1 console.log(float32.indexOf(9, 2)); // 2 console.log(float32.indexOf(2, -1)); // -1 console.log(float32.indexOf(2, -3)); // 0includes(searchElement, fromIndex?)判断是否包含指定值TFloat32Array.uts 中includes(2.0)返回 true、includes(4.0)返回 false。遍历与变换forEach / map / reduce / reduceRight / joinforEach(callbackfn)对每个元素执行回调new Float32Array([0, 1, 2, 3]).forEach((value: number, index: number, _: Float32Array) { console.log(a[${index}] ${value}); });map(callbackfn) : Float32Array映射生成新数组let numbers new Float32Array([1, 4, 9]); let doubles numbers.map((value: number, _: number, _a: Float32Array): number value * 2); console.log(doubles.toString()); // 2,8,18reduce(callbackfn, initialValue?)从左向右累积accumulator为累加值currentValue为当前元素。不传初始值时以首元素为初值let total new Float32Array([0, 1, 2, 3]); let res1 total.reduce((accumulator: number, currentValue: number, _: number, _a: Float32Array): number accumulator currentValue ); console.log(res1); // 6 total new Float32Array([0, 1, 2, 3]); let res2 total.reduce((accumulator: number, currentValue: number, _: number, _a: Float32Array): number accumulator currentValue, 8 ); console.log(res2); // 14初值 8reduceRight(callbackfn)从右向左累积let total new Float32Array([0, 1, 2, 3]); let res total.reduceRight((accumulator: number, currentValue: number, _: number, _a: Float32Array): number accumulator currentValue); console.log(res); // 6join(separator?) : string以分隔符拼接为字符串默认逗号let float32 new Float32Array([1, 2, 3]); console.log(float32.join()); // 1,2,3 console.log(float32.join( / )); // 1 / 2 / 3 console.log(float32.join()); // 123原地修改fill / copyWithin / reverse / set / sortfill(value, start?, end?)用指定值填充[start, end)区间支持负索引console.log(new Float32Array([1, 2, 3]).fill(4).toString()); // 4,4,4 console.log(new Float32Array([1, 2, 3]).fill(4, 1).toString()); // 1,4,4 console.log(new Float32Array([1, 2, 3]).fill(4, 1, 2).toString()); // 1,4,3 console.log(new Float32Array([1, 2, 3]).fill(4, -3, -2).toString()); // 4,2,3copyWithin(target, start, end?)将[start, end)区间的元素拷贝到target起始位置同一数组内移动区间重叠时按拷贝语义处理let float32 new Float32Array(8); float32.set([1, 2, 3], 1); float32.copyWithin(3, 0, 3); console.log(float32.toString()); // 0,1,2,0,1,2,0,0reverse()原地反转let float32 new Float32Array([1, 2, 3]); float32.reverse(); console.log(float32.toString()); // 3,2,1set(array, offset?)将数组或另一个类型化数组写入当前数组可从指定偏移开始。array既可以是普通数组也可以是 Float32Array这是最常用的批量写入方式TFloat32Array.uts 对两种入参均有断言let float32 new Float32Array(8); float32.set([1, 2, 3], 1); console.log(float32.toString()); // 0,1,2,3,0,0,0,0 let typed_src new Float32Array([1, 2, 3, 4, 1, 2, 3, 4, 1, 2, 3, 4, 1, 2, 3, 4]); let typed_dest new Float32Array(16); typed_dest.set(typed_src); // 类型化数组之间也可直接 set console.log(typed_dest.toString()); // 1,2,3,4,1,2,3,4,1,2,3,4,1,2,3,4sort(compareFn?)默认按元素值升序浮点数值排序非字典序传入比较函数(a, b) a - b可显式升序let numbers new Float32Array([40, 1, 5]); numbers.sort(); console.log(numbers.toString()); // 1,5,40 numbers.sort((a, b): number a - b); console.log(numbers.toString()); // 1,5,40切片与视图slice / subarray两者都返回新视图区别在于slice 会拷贝数据返回独立数组而subarray 与原数组共享同一底层缓冲区性能更高、无拷贝开销// slice拷贝 let float32 new Float32Array([1, 2, 3]); console.log(float32.slice(1).toString()); // 2,3 console.log(float32.slice(-2).toString()); // 2,3 console.log(float32.slice(0, 1).toString()); // 1 // subarray共享缓冲区 let buffer new ArrayBuffer(16); let f32 new Float32Array(buffer); f32.set([1, 2, 3]); console.log(f32.toString()); // 1,2,3,0 let sub f32.subarray(0, 4); console.log(sub.toString()); // 1,2,3,0迭代器entries / keys / values / toStringentries()返回[索引, 值]对的迭代器。iOS 平台取值时需要使用!解包见 TFloat32Array.uts 中的条件编译示例let arr new Float32Array([10, 20, 30, 40, 50]); let entries arr.entries(); // #ifndef APP-IOS let value1 entries.next().value[1] // #endif // #ifdef APP-IOS let value1 entries.next().value![1] // #endif console.log(value1); // 10keys()返回索引迭代器let arr new Float32Array([10, 20, 30, 40, 50]); let keys arr.keys(); let ret keys.next().value; console.log(ret); // 0values()返回值迭代器let arr new Float32Array([1, 2, 3]); let values arr.values().next().value; console.log(values); // 1toString() : string以逗号拼接全部元素是调试二进制数据的快捷手段上文几乎所有示例均通过它打印结果。兼容性速查与实战建议本文档为每个 API 标注了两套兼容矩阵整理要点如下| 能力 | Web | Android | iOS | HarmonyOS | iOS(VDOM) UTS 插件 | | :- | :- | :- | :- | :- | :- | | 构造length / buffer 模式 | √ | 4.25 | 4.11 | 4.61 | 4.51 | | 构造array 模式 | √ | 4.25 | √ | 4.61 | 4.51 | | 静态属性/方法、绝大多数实例方法 | √ | 4.25 | 4.11 | 4.61 | 4.51 | | ArrayBuffer.toByteBuffer() | x | 4.25 | x | x | — | | ArrayBuffer.toData() | x | x | x | x | 4.51 |同时适用于 uni-app 侧的 Android/iOS/HarmonyOS UTS 插件iOS UTS 插件为 4.51。使用建议计算缓冲区大小时用BYTES_PER_ELEMENT而非硬编码 4便于将来切换为 Float64Array 时无需改动逻辑读大文件、处理网络流等场景优先subarray切片共享内存避免slice拷贝带来的开销若确实需要独立副本再使用sliceset是批量写入的首选既支持普通数组也支持类型化数组配合偏移参数可实现分段组装协议包iOS 与 Android 存在细节差异如迭代器解包符、toByteBuffer/toData的平台专属性跨端代码建议用条件编译包裹平台特有调用参见 条件编译想验证全部 API 行为可直接在 hello-uts 工程中运行 TFloat32Array 测试类其覆盖了本文所述的全部构造方式、静态方法与实例方法并配有expect断言。Float32Array 与 Int8Array、Uint8Array、Int16Array、Uint32Array、Float64Array 等共同构成 UTS 的类型化数组体系对应文档见 buildin-object-api 目录它们均以 ArrayBuffer 为底层存储可按需切换视图完成字节级、整型与浮点型数据的灵活互操作。【免费下载链接】uni-appA cross-platform framework using Vue.js项目地址: https://gitcode.com/gh_mirrors/un/uni-app创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考