Javascript - Лучшая практика использования If Else в этом примере

Question

В настоящее время я изучаю Javascript и работаю через скалу, ножницы, бумажный учебник. На этом сайте уже есть несколько запросов, основанных на том же учебнике в Codeacademy. Однако мой запрос основан на моей перспективе, и поэтому я был бы признателен за некоторые отзывы сообщества SO.

Мой код выглядит следующим образом: -

var userChoice = prompt("Are you picking rock, paper or scissors?"); 
var computerChoice = Math.random(); 
if (computerChoice < 0.34) { 
    computerChoice = "rock"; 
} else if(computerChoice <= 0.67) { 
    computerChoice = "paper"; 
} else { 
    computerChoice = "scissors"; 
} 

console.log ("Computer picks" + " " +computerChoice); 
var compare = function (choice1, choice2) { 
    if (choice1 === choice2) { 
     console.log ("You're both psychic. It's a tie!"); 
    }  


    if (choice1=="rock") { 
     if (choice2 =="scissors") { 
      console.log ("Rock wins. You bad boy, you."); 
     } 
     if (choice2=="paper") { 
     console.log ("Paper wins. You noob") ; 
     } 
    } 

    if (choice1=="paper") { 
     if (choice2=="rock") { 
      console.log ("Paper wins. You bad boy, you."); 
     } 
     if (choice2=="scissors") { 
      console.log ("Scissors wins. You noob.") ; 
     } 
    } 

    if (choice1=="scissors") { 
     if (choice2=="rock") { 
      console.log ("Rock wins, you noob"); 
      } 
     if (choice2=="paper") { 
      console.log ("Scissors wins. You bad boy, you."); 
     } 
    } 

    }; 

    compare (userChoice,computerChoice); 

Я всегда думал, что при использовании условных, это должно быть только одно из перечисленных ниже случаев:

1. одно условия, то просто if все в порядке.
2. больше, чем одно условие, то оно должно быть if, а в конце else ИЛИ if, else if и т.д., и заканчиваться else.

В результате, я сначала использовал else во втором вложенном, условный оператор здесь if (choice2=="paper"). Затем понял, что логика была неправильной, потому что она также напечатала эту строку, если это была связь.

Итак, я подумал об этом и понял, что это сработает, если я использую if вместо другого. И это действительно работает. Тем не менее, я просто не уверен, что мой код просто ошибается ... или не идеален. Это?

Кроме того, чтобы сделать его лучше (и не только полный if iS) Я думал об обмене вне if в if (choice1=="paper") с else if. Однако я не знаю, как закончить следующее условие - if (choice1=="scissors") {. Как бы вы это сделали?

Прощение длинных запросов - я просто стараюсь, чтобы я хорошо это понял.

Благодаря

Answer 1

Это совершенно кода стиль, так что вы должны стремиться к «чистому коду».

Самой наивной альтернативой было бы использование переключателя. Например:

var compare = function (choice1, choice2) { 

    switch(true){ 
     case choice1 === choice2: 
      console.log ("You're both psychic. It's a tie!"); 
      break; 
     case choice1 === "rock": 
      if(choice2 === "scissors"){ 
       console.log ("Rock wins. You bad boy, you."); 
      } else{ 
       console.log ("Paper wins. You noob") ; 
      } 
      break; 
     case choice1 === "paper": 
       if (choice2=="rock") { 
        console.log ("Paper wins. You bad boy, you."); 
       } else{ 
        console.log ("Scissors wins. You noob.") ; 
       } 
      break; 
     case choice1 === "scissors": 
      if (choice2=="rock") { 
       console.log ("Rock wins, you noob"); 
      } else{ 
       console.log ("Scissors wins. You bad boy, you."); 
      } 
      break; 
    } 
}; 

Это только один метод. Независимо от того, что вы выберете, вы должны попытаться сделать код более чистым и элегантным.

Эта версия может выглядеть лучше:

var compare = function(choice1, choice2){ 
    var options = ['rock','paper','scissors']; 
    var result = options.indexOf(choice1) - options.indexOf(choice2); 
    switch(result){ 
     case 1: 
     case -2: 
      //choice1 wins 
      break; 
     case 0: 
      //tie 
      break; 
     case -1: 
     case 2: 
      //choice2 wins 
      break; 
    } 
} 

Но эта версия не так сразу понял - так что есть решение, которое лучше, чем как это и первое одно решение, которое чище и гораздо проще для понимания читателя - вы должны попытаться его найти.

Answer 2

if(choice1 == choice2){ 
    console.log ("You're both psychic. It's a tie!"); 
} 
if(choice1 == "rock"){ 
    if(choice2 == "scissors"){ 
     console.log ("Rock wins. You bad boy, you."); 
    } 
    else { 
     console.log ("Paper wins. You noob") ; 
    } 
} 
... 

choice1 Предполагая, и choice2 оба "rock", функция проверяет if(choice1 == choice2). Это верно, поэтому он печатает сообщение 'tie'.

Потому что следующее условие также является if, тогда оно проверяет, choice1 - "rock". Таким образом, он входит в вложенный блок, проверяет, является ли choice2 «ножницами» - это не так, поэтому он перемещается в блок else и печатает сообщение «бумажные победы».

Когда это галстук, choice1 == choice2, вам действительно не нужно ничего проверять. else if и else условные обозначения проверяются только в том случае, если условия до этого не выполняются.

Таким образом, вы можете изменить его на:

if(choice1 == choice2){ 
    console.log ("You're both psychic. It's a tie!"); 
} 
else if(choice1 == "rock"){ 
    if(choice2 == "scissors"){ 
     console.log ("Rock wins. You bad boy, you."); 
    } 
    else { 
     console.log ("Paper wins. You noob") ; 
    } 
} 
else if(choice1 == "paper"){ 
    ... 
} 
else{ //choice1 == "scissors" 
    ... 
} 

Вы можете также выйти из функций рано, используя return заявления. Или, как предлагает Etai, вы можете использовать switch, чтобы проверить условия.

Answer 3

Определенно использовать еще, если, так что второе условие тест выполняется только в случае, если первый был ложным

if ('hi' === 'hi) { 
    console.log('true'); 
} else{ 
    console.log('this will never log') 
} 

также может быть написана с троичной оператора:

'hi' === 'hi' ? console.log('true') : console.log('this will never log'); 

Альтернативный трехкомпонентную вариант -

console.log('hi' === 'hi' ? 'true' : 'this will never log');