function dataURLtoBlob(dataurl) {
    var arr = dataurl.split(','); 
    var mime = arr[0].match(/:(.*?);/)[1];
    var bstr = atob(arr[1]);// base64解码
    var n = bstr.length;
    var u8arr = new Uint8Array(n); // 开辟一个无符合n*8个字节的空间，最小操作单位为8位比特bit
    while (n--) {
        // base64解码之后，需要将每一位放置uint8array对象中
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new Blob([u8arr], { type: mime }); // 转换为浏览器内置的对象
}
 
function downloadFile(url, name='defaultFileName') {
    var a = document.createElement("a")
    a.setAttribute("href",url)
    a.setAttribute("download",name)
    a.setAttribute("target","_blank")
    // 触发下载
    let clickEvent = document.createEvent("MouseEvents");
    clickEvent.initEvent("click", true, true);  
    a.dispatchEvent(clickEvent);
}
 
function downloadFileByBase64(base64,name) {
    // 把base64转换成浏览器认识的blob对象
    var myBlob = dataURLtoBlob(base64)
    // 变成blobURL对象（html标签可以直接引用的对象）
    var myUrl = URL.createObjectURL(myBlob)
    downloadFile(myUrl, name)
}
 
// base64放在这里即可下载
downloadFileByBase64('data:image/png;base64,', 'customFileName')

fileInput = document.querySelector('input[type=file]');
fileInput.addEventListener('change', function() {
  var fr = new FileReader();
  // 监听读取结果
  fr.onload = function() {
      console.log("读取的结果为", this.result)
      console.log("读取的类型为", typeof(this.result))
  };
  // 读取结果为arrayBuffer类型(只能读取一次)
  fr.readAsArrayBuffer(this.files[0])
  // 读取结果为text(只能读取一次)
  fr.readAsText(this.files[0])
  // 读取结果为其他类型(具体详见api)(只能读取一次)
  fr.readAs...(this.files[0])
});

//创建一个长度为8的ArrayBuffer，此时开辟一个固定8个字节的缓冲区也就是64位
var buffer = new ArrayBuffer(8);

//返回大小
console.log(buffer.byteLength)  //8

// 创建8个字节长度的缓存冲
const buffer = new ArrayBuffer(8);

const uint8Array = new Uint8Array(buffer);

// log: [0, 0, 0, 0,0, 0, 0, 0]
console.log(uint8Array);

// 将buffer转化为Uint16Array
// Uint8Array中每一个元素表示两个字节（16位）
const uint16Array = new Uint16Array(buffer);

// log: Uint16Array(4) [ 0, 0, 0, 0 ]
console.log(uint16Array);

// 64位 8字节 -> 4个元素（log:4）
console.log(uint16Array.length);

new DataView(buffer [, byteOffset [, byteLength]]);

// 创建8个字节长度的缓存冲
const buffer = new ArrayBuffer(8);

// 根据传入的buffer 从第一个字节开始，并且字节长度为匹配buffer的长度
const dataView = new DataView(buffer);

// 将DataView中偏移量为0个字节的字节，也就是第一个字节设置为十进制的1
dataView.setUint8(0, 1);
// 将DataView中偏移量为1个字节的字节，也就是第二个字节设置为十进制的2
dataView.setUint8(1, 2);

// 从dataView中偏移第0个字节，也就是第一个字节，获取8位
// log: 1
dataView.getUint8(0);

// 从dataView中偏移第一个字节获取八位，也就是获取第二个字节的值
// log: 2
dataView.getUint8(1);

// 偏移量为0个字节，获取后续16位大小（也就是获取前两个字节大小）
// log: 258
dataView.getUint16(0);

// 偏移量为2个字节，设置后16位大小为256（也就是设置第三个字节和第四个字节大小和为256）
dataView.setUint16(2, 256);

// 偏移量为2个字节，获取后16位大小
// log: 256
dataView.getUint16(2);