JavaScript无需回调将Blob转换为Uint8Array并赋值给变量的方法

结论 #

首先，Blob转Uint8Array的底层接口本身是异步设计的，不存在完全同步、不依赖任何异步机制的转换方案，但你可以用async/await语法替代显式回调函数，代码结构和同步写法高度一致，不需要自定义回调。

原代码问题分析 #

你提供的代码无法赋值成功有两个核心原因：

• blob2uint函数没有返回值，调用后默认返回undefined
• arrayBuffer()是异步方法，then回调内的返回值不会作为外层函数的返回值，异步结果无法直接同步返回给调用方

正确实现方案 #

改造后的工具函数 #

将转换函数改造为async异步函数，用await等待异步读取操作完成：

let str = 'content';
const str2blob = (str, type = 'text/plain') => new Blob([str], { type });
const blob = str2blob(str);

async function blob2uint(blob) {
    const buffer = await new Response(blob).arrayBuffer();
    // 直接返回Uint8Array或者展开后的数组都可以，按需调整
    return [...new Uint8Array(buffer)];
}

赋值给uint8data的方法 #

如果你的运行环境支持顶级await（现代浏览器、Node.js 14.8+都支持），可以直接赋值：

let uint8data = await blob2uint(blob);
console.log(uint8data); // 正常输出转换结果

如果不支持顶级await，把逻辑放在自执行异步函数内部即可：

(async () => {
    let uint8data = await blob2uint(blob);
    console.log(uint8data); // 正常输出
    // 所有需要使用uint8data的逻辑都要放在这个异步作用域内
})();

注：原代码中未声明就赋值的uint变量会泄漏为全局变量，改造后的代码已修复该问题。

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