js fetch fileInput.files[0] 构造

在JavaScript中，当你从HTML输入元素如`<input type="file">`获取文件时，可以使用`File API`来访问用户选择的文件。下面是如何使用`fileInput.files[0]`构造一个`File`对象并将其附加到`FormData`：

1. 获取用户选择的文件：

const fileInput = document.querySelector('input[type=file]'); // 假设你有一个id为"fileInput"的file输入字段
const file = fileInput.files[0];

2. 创建`FormData`实例并将文件添加到其中：

const formData = new FormData();
formData.append("file", file);

这里`append()`方法用于将键值对添加到`FormData`中，第一个参数是键名，第二个参数是要附加的值，这里是`file`对象。

3. 使用`fetch`发起POST请求：

// 发送POST请求，这里的URL替换为你实际的API地址
fetch("/api/upload", {
  method: "POST",
  body: formData,
})
.then(response => response.json()) // 根据返回类型处理响应
.catch(error => console.error("Error:", error));

在这个例子中，我们把包含文件数据的`FormData`作为`body`发送到服务器。`fetch`返回的是一个Promise，可以通过`.then()`和`.catch()`处理异步操作的结果。