JS Ternary functions with multiple conditions?

Question

I have been using a ternary operator in JavaScript to modify the value of an object based on user input. I have the following code, which runs as it should:

Answer 1

Unfortunately JavaScript does not provide a super terse and readable way to do this. Personally I would just use some single-line if statements like this:

var inputOneAns;
if (inputOne === 'Yes') inputOneAns = '517';
if (inputOne === 'No') inputOneAns = '518';
else inputOneAns = '';

Which can be even cleaner if you abstract it into a function (note: no need for else in this case):

function getInputOneAns(inputOne) {
    if (inputOne === 'Yes') return '517';
    if (inputOne === 'No') return '518';
    return '';
}

Personally, I don't really like switch statements for this for two reasons: firstly those extra break statements bloating the code, and secondly, switch statements are very limiting - you can only do simple equality checks, and only against a single variable. Besides, in the case that you know you will be always checking a single string I would favour a simple map object:

var map = { 'Yes': '517', 'No': '518' };
var inputOneAns = map[inputOne] || '';

Answer 2

The most elegant and clean way is to take advantage of Object literals:

const Switch = (str) => ({
  "Yes": "517",
  "No": "518",
})[str] || '';

console.log(Switch("Yes")); // 517
console.log(Switch("No"));  // 518
console.log(Switch("Non matching value")); // Empty

This has the advantage of being both readable and flexible.

Answer 3

Yes, and it does provide a cleaner code than switch statement.. with all the breaks..

inputOne == "Yes" ? "517" :
inputOne == "No" ? "518" : inputOneAns = "";

Answer 4

Yeh you can chain them together much like using an else if statement, but it can sometimes be a bit hard to read though, so I tend to split mine over multiple lines.

var inputOneAns = inputOne == 'Yes' ? '517' :
  inputOne == 'No' ? '518' : '';

However in this case I would suggest a switch statement seeing as you're comparing the same value for every case.

Answer 5

Seems like a classic use for a switch statement:

let inputOneAns = '';
switch(inputOne) {
  case 'Yes':
    inputOneAns = "517";
    break;
  case 'No': 
    inputOneAns = "518";
    break;
  default:
    inputOneAns = "";
}

• note you don't actually need the default case, but I find it makes things more readable.

Answer 6

Yes you can go wild nesting ternaries. I find this version to be fairly readable:

var foo = (
  bar === 'a' ? 1 : // if 
  bar === 'b' ? 2 : // else if 
  bar === 'c' ? 3 : // else if
  null // else 
);

but that's not a widely shared opinion, and you should probably stick to if/else or switch when working on a team.