51

Javascript has both File and Blob for file representation, and both are almost the same thing. Is there a way to check if a variable is holding a File or a Blob type of data?

alexandernst
  • 14,352
  • 22
  • 97
  • 197

6 Answers6

103

Easiest way:

a = new File([1,2,3], "file.txt");
b = new Blob([1,2,3]);
c = "something else entirely";

a instanceof File
> true
b instanceof File
> false
c instanceof File
> false
Nick Brunt
  • 9,533
  • 10
  • 54
  • 83
  • 1
    File and Blob don't seem to be available globally in my nodejs environment. Do you know where we can import them from? – JimmyTheCode Dec 08 '22 at 10:44
23

W3.org:

'A File object is a Blob object with a name attribute, which is a string;'

In case of File:

var d = new Date(2013, 12, 5, 16, 23, 45, 600);
var generatedFile = new File(["Rough Draft ...."], "Draft1.txt", {type: 'text/plain', lastModified: d});

console.log(typeof generatedFile.name == 'string'); // true

In case of Blob:

var blob = new Blob();
console.log(typeof blob.name); // undefined

Condition:

var isFile = typeof FileOrBlob.name == 'string';
Reflective
  • 3,854
  • 1
  • 13
  • 25
  • 5
    What if can be a different object with name attribute? – Vedmant Apr 27 '20 at 03:46
  • We can do more detailed check on other attributes if we have another object having 'name' attribute, this is just a simple example. – Reflective Apr 30 '20 at 15:40
  • 9
    What if the object can have most of attributes, but still it's not File or Blob object, I think this is buggy approach, it will return true if object has that properties but that object still may be not Blob or File. Why just not to test just like this `isFile instanceof File` ? – Vedmant May 02 '20 at 06:22
  • @Vendmant Any usage of the File constructor outside of typeOf will throw errors, testing for instance of File when File is not present does not work. I added: typeof File !== 'undefined' && typeof file.name === 'string' Which is not 100%, but gets a little more close to safety. – augurone Jan 04 '23 at 20:20
11

One liner solution to make life easier.

Based on Ric Flair

const isFile = input => 'File' in window && input instanceof File;
const isBlob = input => 'Blob' in window && input instanceof Blob;

const a = new File([1,2,3], "foo.txt", {type: "text/plain"});
...

console.log(isFile(a)) // true
...
Ignacio Bustos
  • 1,415
  • 2
  • 17
  • 26
7

Based on Nick Brunt's:

function isFile(input) {
   if ('File' in window && input instanceof File)
      return true;
   else return false;
}

function isBlob(input) {
    if ('Blob' in window && input instanceof Blob)
        return true;
    else return false;
}

//Test
const a = new File([1,2,3], "foo.txt", {type: "text/plain"});
const b = new Blob([1,2,3]);
const c = "something else entirely";

console.log(isFile(a));    //true
console.log(isBlob(a));    //true
console.log(isFile(b));    //false
console.log(isBlob(b));    //true
console.log(isFile(c));    //false
console.log(isBlob(c));    //false

Won't work for Opera mini as well as IE. Though with IE it won't matter because you may only use file input tags, in that case you'll definitely know it's a file.

Ric Flair
  • 387
  • 3
  • 5
4

Compare the constructor class:

var b = new Blob()
console.log(b.constructor === Blob) // true
Marcos Kubis
  • 485
  • 1
  • 4
  • 11
3

This works for me when trying to determine is an object is a file:

var reader = new FileReader();

if(file.type){
    reader.readAsDataURL(file);
}

If I want to check if it is a specific file type like an image I do this:

if(file.type && file.type.indexOf('image') !== -1){
    reader.readAsDataURL(file);
}
Peter Drinnan
  • 4,344
  • 1
  • 36
  • 29