I have a simple Rock, Paper, Scissors game, I've written my function as an arrow function and my if/else as a ternary operator but it returns an error. It works with a vanilla if / else but not with a ternary.

const getUserChoice = userInput => {

  // normalizes all inputs to lowercase
  userInput = userInput.toLowerCase();

  // checks whether the inputs are valid
  userInput === 'rock' || 'paper' || 'scissors' ? return getUserChoice : console.log('please enter a valid entry');

};

getUserChoice('rock');

I have a simple Rock, Paper, Scissors game, I've written my function as an arrow function and my if/else as a ternary operator but it returns an error. It works with a vanilla if / else but not with a ternary.

const getUserChoice = userInput => {

  // normalizes all inputs to lowercase
  userInput = userInput.toLowerCase();

  // checks whether the inputs are valid
  userInput === 'rock' || 'paper' || 'scissors' ? return getUserChoice : console.log('please enter a valid entry');

};

getUserChoice('rock');

• javascript
• function
• ecmascript-6
• ternary-operator

• 4 That's not how || works. You have to include the left-hand side with each right-hand side. Also you're probably getting a syntax error because your return is in the middle of the expression. – Pointy Commented Jun 26, 2018 at 0:18
• 3 this doesn't "return an error" at all - this code doesn't even parse as valid code - SyntaxError: expected expression, got keyword 'return' – Jaromanda X Commented Jun 26, 2018 at 0:20
• 2 return is a statement; it cannot appear in the middle of an expression. Your parisons need to be userInput === 'rock' || userInput === 'paper' || userInput === 'scissors' etc – Pointy Commented Jun 26, 2018 at 0:23
• 3 Just to clarify because the title is misleading. This issue is not related to the arrow notation that is used. – BShaps Commented Jun 26, 2018 at 0:24
• 2 @meow-meow-meow please first rewrite it to code that runs, by removing that return. The ternary format is a = b ? c : d where b is a conditional, and c and d are expressions. There is no return in there anywhere. At which point I suspect you just solved your own problem. Remember to look at what the actual error is, and if you know what it means, solve it. And if you don't: tell people what it is after googling what it might mean. – Mike 'Pomax' Kamermans Commented Jun 26, 2018 at 0:29

1 Answer 1

As others have pointed out

  userInput === 'rock' || 'paper' || 'scissors' ? return getUserChoice : console.log('please enter a valid entry');

Is not valid JavaScript. It's not even really a valid construct.

The ternary operators are for choosing A or B based on a condition.

 if (condition) {
   return A;
 } else {
   return B;
 }

Using the ternary operators that's

 return condition ? A : B;

but you're returning getUserChoice which is function OR you're returning nothing as console.log('msg') is not something to return.

It's not clear what you wanted to happen. It looks like you wanted to print an error if the user's choice is not one of rock, paper, or scissors

const validateUserChoice = userInput => {

  // normalizes all inputs to lowercase
  userInput = userInput.toLowerCase();

  // checks whether the inputs are valid
  const isValid = userInput === 'rock' || 
                  userInput === 'paper' ||
                  userInput === 'scissors';

  if (!isValid) {
    console.log('please enter a valid entry');
  };

  return isValid;
}

???

Note there are faster ways to check if userInput is one of many valid options. One might be

const validInputs = {
  rock: true,
  paper: true,
  scissors: true,
};
const validateUserChoice = userInput => {

  // normalizes all inputs to lowercase
  userInput = userInput.toLowerCase();

  // checks whether the inputs are valid
  const isValid = !!validInputs[userInput];

  if (!isValid) {
    console.log('please enter a valid entry');
  };

  return isValid;
}

It's also probably not best practice to mix validating with error reporting.

const validInputs = {
  rock: true,
  paper: true,
  scissors: true,
};
const validateUserChoice = userInput => {

  // normalizes all inputs to lowercase
  userInput = userInput.toLowerCase();

  // checks whether the inputs are valid
  return !!validInputs[userInput];
};

if (!validateUserInput(someInput)) {
  console.log('please enter a valid entry');
};

note that the !! just makes something that is falsey to actually be false.

validInputs[userInput]

Will either be true or undefined. Often that's good enough but if you really want it to be true or false then !! does the conversion as in

const userInput = 'bananas'
const temp1 = validInputs[userInput];   // temp1 = undefined
const temp2 = !temp1;                   // temp2 = true
const temp3 = !temp2;                   // temp3 = false

Which is what !! is doing