为何调用FileList.item()时会触发「不是函数」的类型错误？

这个错误的核心原因是你混淆了原生FileList对象和普通JavaScript数组的区别，咱们一步步拆解清楚：

为什么会触发这个错误？ #

1. 首先要明确：浏览器通过文件输入框返回的files确实是FileList类型——这是一个浏览器原生的类数组对象，它自带item()方法来获取指定索引的文件。
2. 但你的this.files变量声明为any = []，本质上是一个普通的JavaScript数组。当你在onImageSelect里执行this.files.push(files.item(i))时，你是把单个File对象推送到了普通数组里，最终this.files是Array<File>类型，而不是FileList。
3. 普通数组根本没有item()方法，所以当你在uploadImages里调用selectedFiles.item(i)时，自然会抛出item is not a function的错误。

如何修复？ #

你只需要把普通数组的访问方式改成用索引直接取值即可，同时建议优化类型声明，让TypeScript帮你提前规避这类错误：

方案1：修正uploadImages方法的文件取值方式 #

把selectedFiles.item(i)改成数组索引访问selectedFiles[i]：

filesUploaded: File[] = []; // 优化类型为File数组，代替模糊的any
uploadImages(selectedFiles: File[] = this.files) {
  for (let i = 0; i < selectedFiles.length; i++) {
    this.filesUploaded.push(selectedFiles[i]); // 用数组索引访问，代替item()
  }
}

方案2：优化整体类型声明（推荐） #

把files也明确声明为File[]，避免any带来的类型模糊：

files: File[] = []; // 明确类型为File数组
onImageSelect(files: FileList) {
  for(let i = 0; i < files.length; i++) {
    this.files.push(files.item(i)); // 从FileList取File对象，推送到数组是完全没问题的
  }
  console.log(this.files)
}

额外提醒 #

FileList是浏览器原生的只读对象，你没办法直接向它push元素——这也是为什么你一开始只能用普通数组来存储选中的文件。记住两个核心区别：

• FileList：类数组结构、只读、自带item()方法
• 普通数组：可读写、用索引[i]访问元素

内容的提问来源于stack exchange，提问作者SeventhWarhawk