Blob File ArrayBuffer TypedArray Int32Array等的区别

本系列文章是本人学习相关知识时所积累的笔记，以记录自己的学习历程，也为了方便回顾知识；故文章内容较为随意简练，抱着学习目的来的同学务必转移他处，以免我误人子弟~

参考资料
mdn: blob
ArrayBuffer和TypedArray，以及Blob的使用
简书：JavaScript(ES6) - ArrayBuffer

Blob

Blob是 Web Api，即是只有浏览器才实现。若在nodejs环境中，则没有此对象

// app.js
let blob = new Blob([])

$ node app.js
  ReferenceError: Blob is not defined

同理，FormData 也是Web Api，因此在nodejs中也是同样的错误-FormData is not defined
blob是一个不变的、包含原始数据的类文件对象，input[type=file]获取的File对象就是基于 Blob接口；

提取 Blob 的数据

Blob --> ArrayBuffer

ArrayBuffer是 web api ，在nodejs中 Buffer 与之类似

var reader = new FileReader();
reader.addEventListener("loadend", function() {
   // reader.result contains the contents of blob as a typed array
   let arrayBuffer = reader.result;
});
reader.readAsArrayBuffer(blob);

Blob ArrayBuffer TypedArray 间的相互转换

let arraybuffer = new ArrayBuffer(32)
let intArray = new Int8Array(arraybuffer)
intArray[0] = 97
let blob = new Blob([intArray], {type: "application/octet-binary"});
let fr = new FileReader();
fr.addEventListener("load", function(e) {
    let arrayBuffer = e.target.result;
    let intArray = new Int8Array(arrayBuffer);
    console.log(intArray);
});
//把blob文件转化为arraybuffer；
fr.readAsArrayBuffer(blob)

ArrayBuffer

ArrayBuffer对象代表储存二进制数据的一段内存，它不能直接读写，只能通过视图（TypedArray视图和DataView视图)来读写，视图的作用是以指定格式解读二进制数据。

ArrayBuffer有两种视图，一种是TypedArray视图，另一种是DataView视图。前者的数组成员都是同一个数据类型，后者的数组成员可以是不同的数据类型。