ArrayBuffer和Blob有什么区别？

I'm reading http://www.html5rocks.com/en/tutorials/file/xhr2/ and trying to figure out the difference between an ArrayBuffer and a Blob.

我正在阅读http://www.html5rocks.com/en/tutorials/file/xhr2/并尝试找出ArrayBuffer和Blob之间的区别。

Aren't both containers comprised of bits? Hence, couldn't both containers be viewed in many ways (as 32-bit chunks, 16-bit chunks, etc.)?

两个容器都不是由比特组成的吗?因此,不能以多种方式查看两个容器(如32位块,16位块等)?

2 个解决方案

#1

It's explained on the page.

它在页面上解释。

ArrayBuffer

An ArrayBuffer is a generic fixed-length container for binary data. They are super handy if you need a generalized buffer of raw data, but the real power behind these guys is that you can create "views" of the underlying data using JavaScript typed arrays. In fact, multiple views can be created from a single ArrayBuffer source. For example, you could create an 8-bit integer array that shares the same ArrayBuffer as an existing 32-bit integer array from the same data. The underlying data remains the same, we just create different representations of it.

ArrayBuffer是二进制数据的通用固定长度容器。如果您需要原始数据的通用缓冲区,它们非常方便,但这些人背后的真正力量是您可以使用JavaScript类型数组创建基础数据的“视图”。实际上,可以从单个ArrayBuffer源创建多个视图。例如,您可以创建一个8位整数数组,该数组与来自相同数据的现有32位整数数组共享相同的ArrayBuffer。基础数据保持不变,我们只是创建它的不同表示。

BLOB

If you want to work directly with a Blob and/or don't need to manipulate any of the file's bytes, use xhr.responseType='blob':

如果您想直接使用Blob和/或不需要操作任何文件的字节,请使用xhr.responseType ='blob':

#2

Summary

Unless you need the ability to write/edit (using an ArrayBuffer), then Blob format is probably best.

除非你需要能够编写/编辑(使用ArrayBuffer),否则Blob格式可能是最好的。

Detail

I came to this question from a different html5rocks page., and I found @Bart van Heukelom's comments to be helpful, so I wanted to elevate them to an answer here.

我从一个不同的html5rocks页面来到这个问题。我发现@Bart van Heukelom的评论很有帮助,所以我想把它们提升到这里的答案。

I also found it helpful to find resources specific to ArrayBuffer and Blob objects. I added the emphasis to reiterate the helpful detail I was looking for. In summary: despite the emphasis on Blob being "raw data" it's very workable.

我还发现找到特定于ArrayBuffer和Blob对象的资源很有帮助。我强调重申我正在寻找的有用细节。总结:尽管强调Blob是“原始数据”,但它非常可行。

The differences from the documentation I wanted to emphasize:

与我想强调的文档的区别:

Mutability
- an ArrayBuffer can be changed (e.g. with a DataView)
- a Blob is immutable

可变性ArrayBuffer可以更改(例如使用DataView),Blob是不可变的

Source
- Quoting Bart van Heukelom:
  - An ArrayBuffer is in the memory, available for manipulation.
  - A Blob can be on disk, in cache memory, and other places not readily available

Source Quoting Bart van Heukelom:ArrayBuffer在内存中,可供操作。 Blob可以位于磁盘,高速缓存内存以及其他不易获得的位置

Access Layer
- ArrayBuffer will require some access layer like typed arrays
- Blob can be passed directly into other functions like window.URL.createObjectURL, as seen in the example from OP's URL.
- However, as Mörre points out you may still need File-related APIs like FileReader to work with a blob.

访问层ArrayBuffer将需要一些访问层,如类型化数组Blob可以直接传递到其他函数,如window.URL.createObjectURL,如OP的URL中的示例所示。但是,正如Mörre指出的那样,您可能仍需要与FileReader等文件相关的API来处理blob。

Convert
- Can convert Blob to ArrayBuffer and vice versa, which addresses the OP's "Aren't both containers comprised of bits?"
- Blob can become an ArrayBuffer using the FileReader's readAsArrayBuffer method
- ArrayBuffer can become a Blob as @user3405291 points out new Blob([new Uint8Array(data)]);, shown in this answer

转换可以将Blob转换为ArrayBuffer,反之亦然,它解决了OP的“不是两个容器都由位组成?” Blob可以使用FileReader的readAsArrayBuffer方法成为ArrayBuffer,ArrayBuffer可以成为一个Blob,因为@ user3405291指出了新的Blob([new Uint8Array(data)]);,在这个答案中显示

Here are the documentation details that helped me:

以下是帮助我的文档详细信息:

Here is ArrayBuffer

这是ArrayBuffer

The ArrayBuffer object is used to represent a generic, fixed-length raw binary data buffer. You cannot directly manipulate the contents of an ArrayBuffer; instead, you create one of the typed array objects or a DataView object which represents the buffer in a specific format, and use that to read and write the contents of the buffer.

ArrayBuffer对象用于表示通用的固定长度原始二进制数据缓冲区。你不能直接操纵ArrayBuffer的内容;相反,您创建一个类型化数组对象或一个DataView对象,它表示特定格式的缓冲区,并使用它来读取和写入缓冲区的内容。

Here is Blob

这是Blob

A Blob object represents a file-like object of immutable, raw data. Blobs represent data that isn't necessarily in a JavaScript-native format. The File interface is based on Blob, inheriting blob functionality and expanding it to support files on the user's system.

Blob对象表示不可变的原始数据的类文件对象。 Blob表示不一定采用JavaScript本机格式的数据。 File接口基于Blob,继承blob功能并将其扩展为支持用户系统上的文件。

#1