How to minimize if else statement with file types in javascript?

Question

I have this code that uses if else statement. I would like to minimize this.

var str = "";
        var isPreview=true;
        var dl = Files.findOne({_id:item._id}).link();
        var filename = item.name.split('.').pop().toLowerCase();
        if(filename == "wav" || filename == "mp3" || filename == "ogg" ) {
            str = "fa fa-file-audio-o";
            isPreview=false;
        }
        else
        if(filename == "jpg" || filename == "jpeg" || filename == "gif" || filename == "bmp" || filename == "png" )
            str = "fa fa-file-image-o";
        else
        if(filename == "flv" || filename == "wmv" || filename == "mp4" || filename == "3gp" || filename == "webm" ) {
            str = "fa fa-file-movie-o";
            isPreview=false;
        }
        else
        if(filename == "pdf" )
            str = " fa fa-file-pdf-o";
        else
        if(filename == "txt" || filename == "rtf" )
            str = " fa fa-file-text-o";
        else
        if(filename == "xls" || filename == "xlsx" ) {
            str = " fa fa-file-excel-o";
            isPreview=false;
        }
        else
        if(filename == "doc" || filename == "docx" ) {
            str = " fa fa-file-word-o";
            isPreview = false;
        }
        else
        if(filename == "ppt" || filename == "pptx" ) {
            str = " fa fa-file-powerpoint-o";
            isPreview = false;
        }
        else
        if(filename == "zip" || filename == "rar") {
            str = " fa fa-file-zip-o";
            isPreview = false;
        }
        else{
            isPreview=false;
            str = " fa fa-file";
        }
        if(Files.findOne({_id:item._id}).infected){
            isPreview=false;
            str = " fa fa-ban";
        }

After executing this codes, the output should be a String and a Boolean. How can I use array to this issue?

As you can see,in each if else statement, they have different number of expressions. Sometimes it will check only 1 file type. sometimes it will check multiple file types.

How can I use array or object in this issue?

It's not really a minimize, but you can change it to a switch/case statement. Would look cleaner (especially as you only have if/else branches on the filename) — Michael Ritter
– Michael Ritter, Commented Jan 22, 2017 at 16:30
Yes, this comment also helps me. But I prefer the answer of Nina for more minimize answer. — JMA
– JMA, Commented Jan 22, 2017 at 17:46

ScaisEdge · Accepted Answer · 2017-01-22 16:34:59Z

3

You should use switch for this

  var filename = item.name.split('.').pop().toLowerCase();
  switch( filename ){
    case 'wav':
    case 'mp3':
    case 'ogg':
        str = "fa fa-file-audio-o";
        isPreview=false;   
    break;

    case 'jpg':
    case 'jpeg':      
    case 'gif': 
    case 'bmp':
    case 'png':     
        str = "fa fa-file-image-o";
        break;

    case 'flv':
    case 'wmv':
    case 'mp4':        
    case '3gp':
    case 'webm':   
        str = "fa fa-file-movie-o";
        isPreview=false;
        break;


    .......


    default:
      // your default value
      break;
    }

answered Jan 22, 2017 at 16:34

ScaisEdge

133k10 gold badges98 silver badges111 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Nina Scholz · Accepted Answer · 2017-01-22 16:48:06Z

You could collect the data in an array and use an object with file type as hash. Then assign the needed values of the found object.

var fileTypes = [
        { type: ["wav", "mp3", "ogg"], preview: false, value: "fa fa-file-audio-o" },
        { type: ["jpg", "jpeg", "gif", "bmp", "png"], preview: true, value: "fa fa-file-image-o" },
        { type: ["flv", "wmv", "mp4", "3gp", "webm"], preview: false, value: "fa fa-file-movie-o" },
        { type: ["pdf"], preview: false, value: " fa fa-file-pdf-o" },
        { type: ["txt", "rtf"], preview: false, value: " fa fa-file-text-o" },
        { type: ["doc", "docx"], preview: false, value: " fa fa-file-excel-o" },
        { type: ["xls", "xlsx"], preview: false, value: " fa fa-file-word-o" },
        { type: ["ppt", "pptx"], preview: false, value: " fa fa-file-powerpoint-o" },
        { type: ["zip", "rar"], preview: false, value: " fa fa-file-zip-o" },
        { type: ["default"], preview: false, value: " fa fa-file" },
    ],
    hash = {};

fileTypes.forEach(function (a) {
    a.type.forEach(function (b) {
        hash[b] = a;
    });
});

var fileType = hash[filename] || hash.default,
    str = fileType.value,
    isPreview = fileType.preview;

klausf · Accepted Answer · 2017-01-22 16:43:48Z

1

Maybe you can use regex:

switch(true) {
    case /^(jpg|jpeg|gif|bmp|png)$/.test(filename):
        // image
        break;
    case /^(flv|wmv|mp4|3gp|webm)$/.test(filename):
        // movie
        break;
    // ...
}

answered Jan 22, 2017 at 16:43

klausf

3093 silver badges8 bronze badges

Comments

Tamas Hegedus · Accepted Answer · 2017-01-22 16:46:06Z

A data driven solution:

const CLASS_AND_PREVIEW_LIST = [
  [["wav", "mp3", "ogg"], [" fa fa-file-audio-o", false]],
  [["jpg", "jpeg", "gif", "bmp", "png"], [" fa fa-file-image-o", true]],
  [["flv", "wmv", "mp4", "3gp", "webm"], [" fa fa-file-movie-o", false]],
];
const CLASS_AND_PREVIEW_INFECTED = {
  cssClass: " fa fa-ban",
  isPreview: false
};
const CLASS_AND_PREVIEW = {};
  
CLASS_AND_PREVIEW_LIST.forEach(([exts, value]) => {
  const fileTypeObj = {
    cssClass: value[0],
    isPreview: value[1]
  };
  exts.forEach(ext => {
    CLASS_AND_PREVIEW[ext] = fileTypeObj;
  });
});

function getClassAndPreviewForExt(ext) {
  if (CLASS_AND_PREVIEW.hasOwnProperty(ext)) {
    return CLASS_AND_PREVIEW[ext];
  }
  return null;
}

function getClassAndPreview(fileObj) {
  if (fileObj.infected) {
    return CLASS_AND_PREVIEW_INFECTED;
  }
  return getClassAndPreviewForExt(fileObj.ext);
}

console.log(getClassAndPreview({ infected: false, ext: "avi"} ));
console.log(getClassAndPreview({ infected: false, ext: "bmp"} ));
console.log(getClassAndPreview({ infected: true, ext: "any"} ));

Collectives™ on Stack Overflow

How to minimize if else statement with file types in javascript?

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related