主页 / coding / 问题 / 79041037
Accepted
Daniel
Asked: 2024-10-01 05:12:40 +0800 CST

为什么 Blob() 使用 Array 和 Uint8Array 产生的结果不同？

  • 772

当所有值都代表原始字节时，为什么Blob()传递 Array 和 Uint8Array 会产生不同的结果？

new Blob([[0,60,0,60]])
// Blob {size: 9, type: ''}

new Blob([new Uint8Array([0,60,0,60])])
// Blob {size: 4, type: ''}
javascript

2 个回答

  1. Best Answer

    总结

    • 将Array数字（[[0,60,0,60]]）传递给Blob构造函数会将它们转换为字符串。
      • "0,60,0,60" 尺寸 = 9
    • Uint8Array将( )传递new Uint8Array([0,60,0,60])给构造函数将导致产生表示给定的Blob内部结果。 BufferArrayBytes
      • [0, 60, 0, 60] 尺寸 = 4

    解释

    第一个 Blob构造函数参数（W3）（blobParts）仅支持三种不同的类型：

    • BufferSource 元素
    • Blob 元素
    • USVString 元素

    输入细分（数组）

    const blob = new Blob([[0, 60, 0, 60]]);
console.log({ size: blob.size, type: blob.type });

    • 外面的数组[]是blobParts序列。
    • 内部数组是的[0, 60, 0, 60]常规 JavaScript 。arraynumbers
    • 常规数字数组：这既不是BufferSource，Blob，也不是USVString。当构造函数遇到不受支持的类型时，它会使用默认的 toString() 方法将其转换为字符串（阅读 3 和 4）。
    • 序列化： [0, 60, 0, 60].toString()结果为字符串"0,60,0,60"。

    console.log([0,60,0,60].toString())
console.log([0,60,0,60].toString().length)

    • 该字符串"0,60,0,60"被视为USVString以 编码的UTF-8。
    • 大小计算： UTF-8中每个字符（包括逗号）占用1个字节，共计9个字节。

    输入明细（Uint8Array）

    const blob = new Blob([new Uint8Array([0,60,0,60])])
console.log({ size: blob.size, type: blob.type });

    • 数组[new Uint8Array([0, 60, 0, 60])]就是blobParts序列。
    • Uint8Array是BufferSource。
    • BufferSource是一个ArrayBuffer，其中每个元素对应一个字节。它是“一个包含指向固定字节数缓冲区的指针（可以为空）的对象”
    • 大小计算： [0, 60, 0, 60]结果为4 个字节。

    console.log(new Uint8Array([0,60,0,60]))
console.log(new Uint8Array([0,60,0,60]).length)

    • 6

  2. Blob构造函数不接受数组数组作为其参数。它接受二进制值数组 - 这些可能是缓冲区、blob、类型数组或字符串，但不是数组。您传递的数组将转换为字符串，其 9 个字符将作为字节放入 blob 中：

    (async() => {
  console.log(new Uint8Array(await new Blob([[0,60,0,60]]).arrayBuffer()));
  console.log(new Uint8Array(await new Blob(["0,60,0,60"]).arrayBuffer()));
  /*
    0: 48 // '0'
    1: 44 // ','
    2: 54 // '6'
    3: 48 // '0'
    4: 44 // ','
    5: 48 // '0'
    6: 44 // ','
    7: 54 // '6'
    8: 48 // '0'
  */
})();

    • 3

相关问题