CODEWITHSUNDEEP
javascriptif-statementswitch-statement
user1486133
user1486133

Reputation: 1487

Creating a check using multiple arguments to produce three different results

I need to find the most succinct way to return one of three values based on two arguments. I think a switch statement is the most succinct but please suggest alternatives.

I have two arguments, type and action

If action == 'close' then the returned result should always be 'Hide'

If action == open then more checks are needed

If action == 'open' && type == 'flight' return show more flights

If action == 'open' && type == 'protection' return show protections

What's the most succinct way to do this without involving multiple nested if statements? This whole statement is already inside another if statement called by a ternary so I don't really want to add more.

This is my current solution, any way I can make this lighter?

createShowLabels: function(testEnabled,action,type){
                if (testEnabled){
                    if(action === 'open'){
                        switch(type) {
                            case 'flight':
                                return 'Show flight times';
                            case 'protection':
                                return 'What\'s this?';
                        }
                    } else {
                        return 'Hide';
                    }
                } else {
                    // Defaults
                    if (action === 'open'){
                        return 'Show more';
                    } else {
                        return 'Show less';
                    }
                }
            },

Upvotes: 2

Views: 32

Answers (2)

T.J. Crowder
T.J. Crowder

Reputation: 1075417

First, let's be clear: "Succinct" is not a synonym for "good," "readable," or "maintainable." Sometimes succinct code is good, readable, and maintainable; sometimes, it isn't.

Given your guarantee in the comments that the values will only be the ones listed, there are several ways.

In my own code, I would probably use somnething like FDavidov's answer but with different formatting:

if (action == 'close') {
    result = 'Hide';
} else if (type == 'flight') {
    result = 'show more flights';
} else {
    result = 'show protections';
}

But you asked for the most succinct way. The conditional operator is succinct, but not necessarily hyper-easy to debug:

result = action == 'close' ? 'Hide' : type == 'flight' ? 'show more flights' : 'show protections';

Example:

function test(action, type) {
  return action == 'close' ? 'Hide' : type == 'flight' ? 'show more flights' : 'show protections';
}
console.log(test('close', 'flight'));
console.log(test('close', 'protections'));
console.log(test('open', 'flight'));
console.log(test('open', 'protections'));

These are all less concise but more configurable:

You can use a lookup object:

var lookup = {
    'close|flight': 'Hide',
    'close|protections': 'Hide',
    'open|flight': 'show more flights',
    'open|protections': 'show protections'
};

result = lookup[action + '|' + type];

Example:

var lookup = {
    'close|flight': 'Hide',
    'close|protections': 'Hide',
    'open|flight': 'show more flights',
    'open|protections': 'show protections'
};

function test(action, type) {
    return lookup[action + '|' + type];
}
console.log(test('close', 'flight'));
console.log(test('close', 'protections'));
console.log(test('open', 'flight'));
console.log(test('open', 'protections'));

Or as you say, a switch:

switch (action + '|' + type) {
    case 'close|flight':      result = 'Hide'; break;
    case 'close|protections': result = 'Hide'; break;
    case 'open|flight':       result = 'show more flights'; break;
    case 'open|protections':   result = 'show protections'; break;
};

Example:

function test(action, type) {
    var result;
    switch (action + '|' + type) {
        case 'close|flight':      result = 'Hide'; break;
        case 'close|protections': result = 'Hide'; break;
        case 'open|flight':       result = 'show more flights'; break;
        case 'open|protections':   result = 'show protections'; break;
    };
    return result;
}
console.log(test('close', 'flight'));
console.log(test('close', 'protections'));
console.log(test('open', 'flight'));
console.log(test('open', 'protections'));

Upvotes: 3

FDavidov
FDavidov

Reputation: 3667

If you are looking for short-handed phrasing, this is not what you are looking for. This is a very simple and READABLE way to write what you want:

if (action == 'close') {
   return 'Hide';
}
else if (action = 'open') {
    if      (type = 'flight'    ) {return 'show more flights'}
    else if (type = 'protection') {return 'show protections' }
}

Upvotes: 2

Related Questions