Question

我正在使用ReactJS制作Rock-Paper-Scissors-Lizard-Spock（大爆炸理论，电视节目），我正面临某种抽象问题。

switch (this.state.playerOnePick === 'Rock') {
    case((this.state.playerTwoPick === 'Scissors') || (this.state.playerTwoPick === 'Lizard')):
    return (
        <div>
            <h1>Player One wins !</h1>
            <h2>P1: {this.state.playerOnePick} P2: {this.state.playerTwoPick}</h2>
        </div>
    );
        break;
    case((this.state.playerTwoPick === 'Paper') || (this.state.playerTwoPick === 'Spock')):
        return (
            <div>
                <h1>Player Two wins !</h1>
                <h2>P1: {this.state.playerOnePick}
                    P2: {this.state.playerTwoPick}</h2>
            </div>
        );
        break;

}

switch (this.state.playerOnePick === 'Lizard') {
    case((this.state.playerTwoPick === 'Spock') || (this.state.playerTwoPick === 'Paper')):
        return (
            <div>
                <h1>Player One wins !</h1>
                <h2>P1: {this.state.playerOnePick} P2: {this.state.playerTwoPick}</h2>
            </div>

        );
        break;
    case((this.state.playerTwoPick === 'Scissors') || (this.state.playerTwoPick === 'Rock')):
        return (
            <div>
                <h1>Player Two wins !</h1>
                <h2>P1: {this.state.playerOnePick} P2: {this.state.playerTwoPick}</h2>
            </div>
        );
        break;

}

Rock vs Paper正在返回正确的结果，无论是谁选择它，当P1：Rock，P2：Lizard，P1按预期获胜，但是当P1：Lizard P2：Rock时，它返回P1赢了.. < / p>

What it returns me when P1:Lizard P2:Rock

蜥蜴应该在哪里赢得对抗摇滚...

（当玩家选择武器时，playerOnePick和playerTwoPick会正确更新）

Answer 1

switch语句的正确用法是

switch (this.state.playerOnePick) {
    case 'Rock':
        switch (this.state.playerTwoPick) {
            case 'Scissors'):
            case 'Lizard':
                return "Player One wins!";
                break; // unnecessary after `return` but well
            case 'Paper':
            case 'Spock':
                return "Player Two wins!";
                break; // as above
        }
        break;
    case 'Lizard':
        switch (this.state.playerTwoPick) {
            case 'Spock':
            case 'Paper':
                return "Player One wins!"
            case 'Scissors':
            case 'Rock':
                return "Player Two wins!";
        }
        break;
}

你所展示的是if / else的布局，有很多布尔条件：

if (this.state.playerOnePick === 'Rock') {
    if ((this.state.playerTwoPick === 'Scissors') || (this.state.playerTwoPick === 'Lizard')) {
        return "Player One wins!";
    } else if ((this.state.playerTwoPick === 'Paper') || (this.state.playerTwoPick === 'Spock')) {
        return "Player Two wins!";
    }
} else if (this.state.playerOnePick === 'Lizard') {
    if ((this.state.playerTwoPick === 'Spock') || (this.state.playerTwoPick === 'Paper')) {
        return "Player One wins!";
    } else if ((this.state.playerTwoPick === 'Scissors') || (this.state.playerTwoPick === 'Rock')) {
        return "Player Two wins!";
    }
}

然而，实施Rock-Paper-Scissors-Lizard-Spock的真正问题就是重复（这给错误留下了很大空间）。实际的编程任务是弄清楚如何减少它提示：为每个可能的选择分配一个整数，然后使用一些数学写一个单独的函数winner(pick1, pick2)，在第一个玩家获胜时返回-1，在第一个玩家获胜时返回0，在第二个玩家获胜时返回1。然后只需从与UI相关的ReactJS代码中调用它。

Answer 2

Switch case不能那样工作。如果你想使用switch case，你可以这样做：

switch(playerOnePick) {
 case 'Rock':
   switch(playerTwoPick) {
    case 'Scissors':
    case 'Lizard':
      // Player 1 wins
      break;
    case 'Paper':
    case 'Spock':
    // Player 2 wins
    break;
   }
   break;
 case 'Lizard':
   switch(playerTwoPick) {
    case 'Spock':
    case 'Paper': 
      // Player 1 wins
     break;
    case 'Scissors':
    case 'Rock': 
    // Player 2 wins
    break;
 }
}

等

编辑：您编写的代码是为if语句构建的，如果用if替换switch和case，它将起作用。

Answer 3

因为你已经这样设定了它。看看最后<h1>。

说，您可以编写更好的switch/case语句来评估条件。你高度重复自己反对 DRY（不要重复自己）校长。

您可以将<h2>P1: {this.state.playerOnePick} P2: {this.state.playerTwoPick}</h2>完全从switch阻止＆amp;在切换}后立即放置它。或者你最好每个案例只放一个单一的值，而不是在一个案例中合并它们中的几个。这使得遵循代码变得更加困难。这是我对这种特殊开关案例的选择：

switch (this.state.playerOnePick === 'Rock') {
    case(this.state.playerTwoPick === 'Scissors'):
         return ( <div> <h1>Player One wins !</h1> </div>);
         break;
    case(this.state.playerTwoPick === 'Lizard')):
         return ( <div> <h1>Player One wins !</h1> </div>);
         break;
    case(this.state.playerTwoPick === 'Paper'):
         return ( <div> <h1>Player Two wins !</h1> </div>);          
         break;
    case(this.state.playerTwoPick === 'Spock'):
         return ( <div> <h1>Player Twi wins !</h1> </div>);        
         break;
    }
// The same goes for second switch
<div><h2>P1: {this.state.playerOnePick} P2:{this.state.playerTwoPick}</h2><div>

如果/ Else / Switch返回错误的结果

3 个答案: