如何在JavaScript中将ArrayBuffer转换为SharedArrayBuffer？含代码示例

通用转换思路 #

首先得明确：你没办法直接把一个ArrayBuffer强制转换成SharedArrayBuffer——它们是两种完全独立的底层内存对象。正确的做法是先创建一个和原ArrayBuffer字节长度一致的SharedArrayBuffer，再把原ArrayBuffer里的数据完整复制过去。

具体步骤拆解：

• 先获取原ArrayBuffer的字节长度：arrayBuffer.byteLength
• 基于这个长度创建新的SharedArrayBuffer：new SharedArrayBuffer(byteLength)
• 借助TypedArray（比如Uint8Array，它按字节操作，适配所有数据类型）完成数据复制

针对你的代码片段的具体实现 #

你的代码已经把数组转成Float32Array并拿到了对应的ArrayBuffer，现在要转成SharedArrayBuffer可以这么写：

const arr = [1.1, 2.2, 3.3];
const arrBuffer = Float32Array.from(arr).buffer;

// 转换为SharedArrayBuffer
const sharedArrBuffer = new SharedArrayBuffer(arrBuffer.byteLength);
// 把原ArrayBuffer的数据复制到新的SharedArrayBuffer里
new Uint8Array(sharedArrBuffer).set(new Uint8Array(arrBuffer));

// 验证一下：从SharedArrayBuffer生成Float32Array，应该和原数据一致
console.log(new Float32Array(sharedArrBuffer)); // 输出 Float32Array(3) [1.100000023841858, 2.200000047683716, 3.299999952316284]

如果你觉得用Uint8Array不够直观，因为原数据是Float32类型，也可以直接用Float32Array来复制：

const sharedArrBuffer = new SharedArrayBuffer(arrBuffer.byteLength);
new Float32Array(sharedArrBuffer).set(new Float32Array(arrBuffer));

额外提醒 #

• 在浏览器里用SharedArrayBuffer时，得确保页面满足跨域隔离要求：服务器要设置Cross-Origin-Opener-Policy: same-origin和Cross-Origin-Embedder-Policy: require-corp这两个响应头，不然浏览器会直接禁用这个API。
• 这个复制操作是深拷贝，原ArrayBuffer和新的SharedArrayBuffer会占用独立内存，修改其中一个不会影响另一个。

内容的提问来源于stack exchange，提问作者Tom