图书馆系列:文件-文件对象

211 阅读2分钟

文件对象:File,它可以存储文件内容,或者创建一个文件对象实例:new File()

我们一般能在<input id="file" type="file" />的dom元素中获取到它,获取方式是:document.querySelector('#file').files[0],由于input可以支持多选上传,所以单选时我们需要取上传的文件列表的第一个文件。

你也可以自己造一个文件实例对象:new File(['你好'], 'demo', { type: 'text/plain', lastModified: Date.now() })

简单看配置是这样的:new File(content, fileName, options)

  • content: 数组,内容是二进制对象或者字符串,是文件内容,每次读取一个元素进行录入
  • fileName:字符串,文件名
  • options:文件配置
    • type: 字符串,表示实例对象的MIME类型,默认为空。
    • lastModified: 时间戳,最近一次修改时间,默认为Date.now()

文件实例对象有什么用?

拓展

MIME类型:

MIME(Multipurpose Internet Mail Extensions)多用途互联网邮件扩展类型。

它可以用来表示文档的性质和格式,浏览器通常用MIME类型(而非文件扩展名)来确定如何处理文档,比如前端的File对象中会有它,后端的响应头也有它。

MIME的组成:type/subtype,即类型/子类,中间以/分割,不允许存在空格。type表示可以被非多个子类的独立类别,subtype表示细分后的每个类型。

常用有:

text/plain
text/html
image/jpeg
image/png
audio/mpeg
audio/ogg
audio/*
video/webm
video/mp4
application/*
application/json
application/octet-stream
...
类型type说明subtype
text普通文本text/plaintext/htmltext/csstext/javascript
image图片image/gifimage/pngimage/jpeg, image/x-icon, image/vnd.microsoft.icon等
audio音频audio/midi, audio/mpeg,audio/ogg, audio/wavaudio/webmaudio/mp3
video视频video/webmvideo/mp4, video/ogg等
application二进制数据application/xmlapplication/pdfapplication/octet-stream,application/pkcs12, application/vnd.mspowerpoint, application/xhtml+xml等