前端数据处理相关

前端数据种类
  1. 常见类型:基础类型+引用类型
  2. Blob对象:File对象继承自Blob,用于处理二进制相关的数据
  //传入二进制字符串,和文件类型,创建一个blob对象
  let blob = new Blob([bin], {
    type: "application/vnd.ms-excel",
  });
  1. File对象:包含文件名称大小类型等属性,文件内容需要FileReader读取
    • 根据二进制流创建const file = new File([bins], 'a.png', {type: 'image/png'});
    • 根据blob创建const file = new File([blob], 'a.png', {type: 'image/png'});
  2. FileReader:读取Blob或File对象,读取结果在res.target.result里面
    • readAsText以文本方式读取
    • readAsDataURL读取为Data URL(base64链接)
    • readAsBinaryString读取为二进制字符串(文件流)
    • readAsArrayBuffer读取为arraybuffer数组
  3. arraybuffer:保存大量二进制数据的数组,只能保存单一类型,只能读不能写
  4. window.URL对象:
    • createObjectURL:接收一个Blob或File对象将其转化为Blob URL(blob链接,类似base64链接)
    • revokeObjectURL:释放创建的blob链接
  5. Base64:一种编码方式,可将二进制流编码为字符串,可以
    • btoa:二进制编码为base64的方法
    • atob:base64解码为二进制的方法
传输数据种类
  1. FormData对象:创建表单对象,通过append增加键值对,可以向服务端传递参数,需要设置请求头
  2. Content-Type:请求头或者返回头属性,表示请求参数或者返回数据的类型
    • application/json:json对象
    • multipart/form-data:FormData对象,主要用于上传文件
    • application/octet-stream:二进制流数据
  3. responseType:接口返回的数据类型
    • "":字符串类型,默认值
    • json:json对象
    • blob:blob对象
    • arrayBuffer:arrayBuffer对象
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容