XMLHttpRequest 的 responseType 属性

XMLHttpRequest.responseType 属性是一个枚举类型的属性，返回响应数据的类型。它允许我们手动的设置返回数据的类型。如果我们将它设置为一个空字符串，它将使用默认的"text"类型。

当将responseType设置为一个特定的类型时，你需要确保服务器所返回的类型和你所设置的返回值类型是兼容的。那么如果两者类型不兼容呢?恭喜你，你会发现服务器返回的数据变成了null，即使服务器返回了数据。还有一个要注意的是，给一个同步请求设置responseType会抛出一个InvalidAccessError 的异常

简而言之，　responseType　的作用就是设置ａｊａｘ　数据响应的类型，　你告诉服务器，让服务器返回什么样的数据类型给你

值	数据类型
‘’	DOMString (这个是默认类型)
arraybuffer	ArrayBuffer对象
blob	Blob对象
document	Document对象
json	JS 对象 ， 解析得到的从服务器返回来的JSON字符串
text	DOMString

 

DOMString

DOMString 是一个UTF-16字符串。由于JavaScript已经使用了这样的字符串，所以DOMString 直接映射到 一个String。

也就是说，在Ajax中，DOMString就等同于JS中的普通字符串。

ArrayBuffer(又称类型化数组)

ArrayBuffer对象用来表示通用的、固定长度的原始二进制数据缓冲区。ArrayBuffer 不能直接操作，而是要通过类型数组对象或 DataView 对象来操作，它们会将缓冲区中的数据表示为特定的格式，并通过这些格式来读写缓冲区的内容。

• 用构造函数来创建一个指定字节长度的 ArrayBuffer 对象。　new ArrayBuffer()

• 从本地文件读取， 利用FileReader.readAsArrayBuffer()，开始读取指定的 Blob中的内容, 一旦完成, result 属性中保存的将是被读取文件的 ArrayBuffer 数据对象.

• 从base64 字符串获取
• 通过ajax请求获取  设置responseType 为  ArrayBuffer 类型

详细介绍见如链接： 

https://blog.csdn.net/qiphon3650/article/details/78454273

设置responseType 为  ArrayBuffer 类型时的业务场景： https://mp.csdn.net/postedit/83090021

 

Blob（Binary Large Object）： 二进制大数据对象

blob的具体使用可参考如下两篇文章：

https://segmentfault.com/a/1190000011563430

https://www.cnblogs.com/hhhyaaon/p/5928152.html

一直以来，JS都没有比较好的可以直接处理二进制的方法。而Blob的存在，允许我们可以通过JS直接操作二进制数据。

Blob 对象表示一个不可变、原始数据的类文件对象。Blob 表示的不一定是JavaScript原生格式的数据。File 接口基于Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。

要从其他非blob对象和数据构造一个Blob，请使用 Blob() 构造函数。

要创建包含另一个blob数据的子集blob，请使用 slice()方法。

要获取用户文件系统上的文件对应的Blob对象，请参阅 File文（File 对象是特殊类型的 Blob）

通俗点说，Blob对象可以看做是存放二进制数据的容器，但是是类似文件对象的二进制数据，因此可以像操作File对象一样操作Blob对象，实际上File是继承自Blob。此外还可以通过Blob设置二进制数据的MIME类型

构造函数创建blob：

var blob = new Blob(dataArr:Array<any>, options:{type:string})

参数说明： 

• dataArray：数组，包含了要添加到Blob对象中的数据，数据可以是任意多个ArrayBuffer，ArrayBufferView， Blob，或者 DOMString对象。
• optons：可选项。

1.    type：默认值为 ""，它代表了将会被放入到blob中的数组内容的MIME类型。
2.    endings，默认值为"transparent"，用于指定包含行结束符\n的字符串如何被写入。 它是以下两个值中的一个： "native"，表示行结束符会被更改为适合宿主操作系统文件系统的换行符； "transparent"，表示会保持blob中保存的结束符不变。

document：

实际上就是XMLHttpRequest中数据返回属性之responseXML，也就是可以解析为XML的数据。因此，这里的Document数据类似你就可以近似看成XML数据类型。通过xhr.responseXML 获取