How can I rewrite this simple switch statement to be more concise?

Question

I have a function that returns a string indicating the image to show for a particular file extension:

getImage = function (file) {
    switch (file.extension) {
        case "txt":
            return "document.jpg";
        case "doc":
            return "document.jpg";
        case "jpg":
            return "image.jpg";
        case "gif":
            return "image.jpg";
        case "png":
            return "image.jpg";
        case "mpg":
            return "video.jpg";

       // And so on for 50+ file extensions...

        default:
            return "file.jpg";
    }
}

I need to support a large number of file extensions, so my switch statement is huge. But since a lot of the file extensions share the same image, I feel like there may be a way to group extensions together to make things more concise.

So how can I re-write this in a more concise manner? (Any answer needs to be compatible with IE8)

In relation to the 700 identical answers - some more than likely inspired by others - you should consider using the same file name for all your extensions. That way you wont have to worry about babysitting 50+ extensions. — Birb, Dec 16 '13 at 07:08

T.J. Crowder · Accepted Answer · 2013-12-16T07:34:24.687

You can combine cases:

getImage = function (file) {
    switch (file.extension) {
        case "txt":
        case "doc":
            return "document.jpg";
        case "jpg":
        case "gif":
        case "png":
            return "image.jpg";
        case "mpg":
            return "video.jpg";

       // And so on for 50+ file extensions...

        default:
            return "file.jpg";
    }
}

You can also use a map instead:

var extmap = {
    "txt": "document.jpg",
    "doc": "document.jpg",
    "jpg": "image.jpg",
    "gif": "image.jpg",
    "png": "image.jpg",
    "mpg": "video.jpg",
    // And so on for 50+ file extensions...
};
getImage = extmap[file.extension] || "file.jpg";

...but then you can't combine cases.

Well this is embarassing. I guess I forgot one of the core concepts underpinning the switch statement. — XåpplI'-I0llwlg'I -, Dec 16 '13 at 07:16

score 2 · Answer 2 · answered Dec 16 '13 at 07:06

2

var types = {"txt":"document.jpg", "doc":"document.jpg"}
return types[file.extension]

answered Dec 16 '13 at 07:06

Igor Benikov

884
6
21

is missing default value – levi Dec 16 '13 at 07:11
Return types[file.extension] || default value )) – Igor Benikov Dec 16 '13 at 07:23

score 2 · Answer 3 · answered Dec 16 '13 at 07:10

2

getImage = function (file) {
  var img  = ['jpg', 'gif', 'png' ...]
  ,   doc  = ['doc', 'text' ...]
  ,   vid  = ['mpg', 'mp4' ...]
  ,   ext  = file.extension
  ;
  if (img.indexOf(ext) >= 0) return 'image.jpg';
  if (doc.indexOf(ext) >= 0) return 'document.jpg';
  if (vid.indexOf(ext) >= 0) return 'video.jpg';

  return 'file.jpg';
 }

answered Dec 16 '13 at 07:10

Jay Harris

4,201
17
21

Instead of using three variables you could create an array of arrays. – Salman A Dec 16 '13 at 07:16

score 1 · Answer 4 · answered Dec 16 '13 at 07:05

You can combine case for same return value

getImage = function (file) {
    switch (file.extension) {
        case "txt":
        case "doc":
            return "document.jpg";
        case "jpg":
        case "gif":
        case "png":
            return "image.jpg";
        case "mpg":
            return "video.jpg";

       // And so on for 50+ file extensions...

        default:
            return "file.jpg";
    }
}

score 1 · Answer 5 · answered Dec 16 '13 at 07:08

1

As mentioned in other answers, you can combine cases. This would be better in your case since one image maps to multiple extensions. Other possibility is to use an object literal:

getImage = function (file) {
    var imageList = {
        txt: "document.jpg",
        doc: "document.jpg",
        // ...
    };
    return imageList[file.extension] || "file.jpg";
}

answered Dec 16 '13 at 07:08

Salman A

262,204
82
430
521

Thank you for breaking the pattern of copy/paste people, and providing a much nicer way of doing things. I at least prefer to have as little actual code (logic) as possible. – Birb Dec 16 '13 at 07:10

score 0 · Answer 6 · answered Dec 16 '13 at 07:04

One simple solution could be instead of switch use if

if( file.extension == "txt" || file.extension == "doc" || ... )
   return "image.jpg";


The switch statement is used to perform different action based on different conditions

in your case I think if is better.

Krish R · Answer 7 · 2013-12-16T07:10:35.453

Can you try this, You can group the case statement

getImage = function (file) {
    switch (file.extension) {
        case "txt":            
        case "doc":
            return "document.jpg";
        case "jpg":            
        case "gif":            
        case "png":
            return "image.jpg";
        case "mpg":
            return "video.jpg";

       // And so on for 50+ file extensions...

        default:
            return "file.jpg";
    }
}

score 0 · Answer 8 · answered Dec 16 '13 at 07:05

If you want to use switch to group the extension, you could use this:

switch (file.extension) {
        case "txt":
        case "doc":
            return "document.jpg";
        case "jpg":
        case "gif":
        case "png":
            return "image.jpg";
        case "mpg":
            return "video.jpg";

       // And so on for 50+ file extensions...

        default:
            return "file.jpg";
    }

score 0 · Answer 9 · answered Dec 16 '13 at 07:10

0

you can use a dictionary,

var format_dict = {"txt":"document.jpg", "doc":"document.jpg","mpg":"video.jpg"......};

if (file.extension in format_dict) {

      return format_dict[file.extension];
}

return "file.jpg";

answered Dec 16 '13 at 07:10

levi

22,001
7
73
74

score -2 · Answer 10 · answered Dec 16 '13 at 07:07

-2

You can just add commas in your cases as follows:

getImage = function (file) {
switch (file.extension) {
    case "txt","doc":
        return "document.jpg";        
    case "jpg","gif","png":
        return "image.jpg";                
    case "mpg":
        return "video.jpg";

   // And so on for 50+ file extensions...

    default:
        return "file.jpg";
}

}

answered Dec 16 '13 at 07:07

Kunal Valecha

207
1
8

1

This will parse but not produce correct output. JavaScript is not VBScript! – Salman A Dec 16 '13 at 07:17

How can I rewrite this simple switch statement to be more concise?

10 Answers10