I was working on a new feature for a web application recently. It involved uploading multiple files at a time. Nothing too fancy. But it had been a while since I had worked directly with an HTML file input. I was surprised to find I couldn’t iterate over the selected files using modern JavaScript array methods.
It turns out the files are returned as a FileList, on which the MDN docs have this to say:
This interface was an attempt to create an unmodifiable list and only continues to be supported to not break code that's already using it… These historical reasons do not mean that you as a developer should avoid
FileList
… However, be careful of the semantic differences from a real array.
I thought that was funny.
“This continues to be supported to not break code that's already using it,” Feels like a fundamental truth about software development. It’s certainly a phenomena present in every code base I’ve worked in. Turns out fundamental JavaScript specifications are no exception.
Once you’ve built something, which then gets used to build other things, which then gets used to build more things, it gets buried under layers and layers of abstraction and it gets harder and harder to change the original thing without breaking everything that depends on it.
Out of curiosity, I looked at the File API spec, and it turns out they have labelled the FileList interface as “at risk”.
Note: The
FileList
interface should be considered "at risk" since the general trend on the Web Platform is to replace such interfaces with theArray
platform object in ECMAScript [ECMA-262]. In particular, this means syntax of the sortfilelist.item(0)
is at risk; most other programmatic use ofFileList
is unlikely to be affected by the eventual migration to anArray
type.
So eventually it will be cleaned up. That’s good news. But this also sounds familiar. Like the output of many a team meeting where we decide that eventually we’ll refactor that outdated piece of code, it’s just not a priority right now. For now, let’s just keep it as is so we don’t break any code that’s using it.
I like how you write