Rock, Paper, Scissors. Mi primer "proyecto". ¿Qué mejoraríais?

Simplemente es poner la palabra y te pone si ganas o no, no?

Yo pondria como una especie de loading, que salieran las 3 imagenes cargando, y al final se seleccionara una de las 3, y comparara con lo que has elegido tu, y en la pantalla final saliera la imagen que has elegido tu, y la que ha sacado la maquina, y el mensaje que ya sacas.

Si haces eso, pues te quedara algo mejor, ahora mismo solo es un dialog con un input y un texto.

Está bien, además estás cacharreando con clases también que eso al principio suele costar. Ahora es cosa de ir tirando más código y probando nuevas cosas.

Tampoco hay mucho que se pueda decir, pero dos cosas pequeñas que se me ocurieron, si tienes un if con un return no necesitas añadir el else, porque si el if se cumple nunca se ejecutará lo que viene detrás. Esto ayuda a que quites indentación que cuando se empiezan a acumular niveles de indentación se hace más difícil leer el código. Además de eso los valores con los que juegas (ROCK, PAPER, SCISSORS) los metería como constantes para que te los pille bien el IDE (sé que te autocompletará igualmente las palabras igualmente, pero mejor tenerlo a nivel de lenguaje y no de texto).

#7 #8 Gracias, a ver, se que no hay mucho de donde sacar, pero es que tampoco tenia muchas ideas de qué hacer XD perdonad si el tema es un poco mierda

el codigo ya lo tengo subido a github, pero tampoco veia mucho sentido a ponerlo para estas cosas simples, por eso lo he puesto en esas paginas que es algo más "directo" de ver

entonces cómo lo harías? si tengo que retornar uno de tres posibles valores en una función

return DRAW / PLAYER / CPU

necesito un else para retornar al menos uno de ellos, de la otra forma sólo podría retornar dos, no? el que cumpla y luego el "default" por llamarlo de alguna forma.

if (winner === 'PLAYER') {
return 'PLAYER'
}

return 'COMPUTER'

}

qué hago con el 'DRAW' entonces?

con lo de las constantes tienes toda la razón, de hecho en Java lo hice así XD

#11 Joder, no lo he hecho, pero me lo estoy imaginando mentalmente y tiene pinta de que la funcion para computar el ganador puede llegar a convertirse en una montaña de mierda

Gracias, intentare hacerlo porque tiene buena pinta para escalar un poco el proyecto.

Aunque no tengo ni idea de qué te refieres con lo de la cuadrícula :/

En JS se puede optimizar esto muy facilmente con un objeto:

const weakness = {
  'ROCK': 'SCISSORS',
  'PAPER': 'ROCK',
  'SCISSORS': 'PAPER'
}

  determineWinner(cpu, player) {
    if (cpu === player) {
      return 'DRAW';
    } else if (weakness[player] === cpu) {
      return 'PLAYER';
    }

return 'CPU';
  }

Ese metodo ya no creceria nunca, aunque le metieses los casos de spock como te han puesto arriba.
Y sobre todo te recomiendo usar y destructurar objetos en los parametros de las funciones para saber que son. En typescript aun te puedes salvar, pero en JS es facil perder el hilo.
E.g.:

  constructor({isComputer} = {isComputer: false}) {
    ...
  }
  ...
  this.cpu = new Player({isComputer: true});

es un poco criptico poner default values directamente en el constructor en JS. Si usases typescript seria un poco mas intuitivo ya que puedes definir la interfaz en otro lado y se diferencia con lo que es la instancia. P. eg:

interface PlayerConfig {
  isComputer: boolean;
}

class Player {
  constructor({isComputer}: PlayerConfig = {isComputer: false}) {}
}

Mira esta imagen: https://imgur.com/a/ioqfEr6
Lo azul es la definicion del objeto. Ahi es donde estas destructurandolo, solo demuestras su estructura.
Lo verde es un objeto anonimo. Puedes utilizar otro definido previamente y funcionara igual. Se usara ese valor cuando no hayas pasado nada al constructor.
Otro ejemplo de como se podria hacer lo mismo pero sin objetos anonimos:

const defaultConfig = {isComputer: false};
class Player {
  constructor({isComputer} = defaultConfig) {
    this.isComputer = isComputer;
  }
}

Y la magia de JS reside en su flexibilidad. Puedes utilizar fallbacks con el operador OR.

class Player {
  constructor({isComputer}) {
    this.isComputer = isComputer || false;
  }
}

En este caso, si omites isComputer, seria undefined, asi que en la asignacion dentro del constructor iria a la parte de la derecha.