Um momento
Aula 22
Cursos / Jogo da Velha com HTML, CSS, e JavaScript
Highlight da Vitória no Jogo da Velha

Summary

Resumo do Transcript

Neste vídeo, o apresentador discute como modificar uma função de verificação de vitória em um jogo, permitindo que o fundo da linha, coluna ou diagonal ganhadora mude de cor.

Pontos principais:

  • Objetivo: Mudar a cor de fundo da linha/coluna/diagonal vencedora ao ganhar no jogo.

  • Desafio: A função atual de checagem de vitória apenas retorna true ou false, sem identificar qual posição venceu.

  • Proposta de Modificação:

    • Alterar a função de checagem para retornar null se não houver vitória.
    • Se houver vitória, retornar uma lista com os IDs das posições ganhadoras (ex.: posição 1, posição 2, posição 3).
  • Implementação da Solução:

    • Definir uma variável de vencer como null.
    • Utilizar a função find para encontrar posições específicas.
    • Exemplo do funcionamento da função find:
      • find retorna o elemento que satisfaz a condição, em vez de um valor booleano.
      • Se um elemento corresponder à condição, ele é retornado; caso contrário, retorna undefined.

O apresentador sugere que essa lógica deve ser aplicada na implementação da verificação de vitória no jogo.

Video Transcript

Olá pessoal, na cidade da aula eu gostaria de dizer como você pode fazer, por exemplo, quando você ganhar, ele mudar a cor de fundo da linha ou vertical ou horizontal, ou diagonal que você ganhou, por exemplo, a cor de fundo desses tis, onde o tis estaria mudado. Para poder fazer isso, a gente tem que saber qual é a posição, os passos que ele ganhou, o jogador. Então, para poder fazer isso agora, a função checa a vitória, só retorna true ou false, a gente não sabe qual é o espaço que ganhou. Então, a gente tem que modificar isso, por exemplo, uma maneira seria retornar a função checa a vitória, valor null, retorna null, senão for vitória, e retorna outra coisa. Eu vou tirar retorna true ou false. Senão for vitória, retorna null, senão for vitória, retorna uma lista com os idês, os três idês dos espaços que foram relacionados. Por exemplo, a posição 1, posição 2, o idê, né, posição 3. E esses caras seria, por exemplo, nesse caso aqui seria centro acima, posição 1, centro acima, posição 2, centro acima, posição 3, a gente usaria esses idês para poder ser racional os elementos e mudar a cor de fundo, tá? Então, vamos fazer isso. Então, let de vencer, eu vou mudar para null. Então, quando você fizer aqui esse cara aqui, Samus, ok, a gente tem que mudar esse cara aqui, tá? Em vez de, em vez de retornar e usar o Samus, a gente vai ter que usar o find, tá? Find é o seguinte, você tem, por exemplo, a, b, c, e você quiser find e encontrar uma letra, por exemplo, letra, onde a letra é a. Em vez de retornar true, ele vai retornar o, a própria elemento que essa condição dá verdade, tá? Então, retornar a, por exemplo, por exemplo, x vai tornar undefined porque ele não encontrou. Por exemplo, ele vai aqui, começa no a. Letra agora é a, será que a é igual a x? Não, false, então ele continua. B é agora a letra. B, B é igual a x, não, false, então ele continua. C, C é igual a x, não, então ele continua, terminou, como não achou nada, retornou undefined. Agora, no caso de achar alguma coisa, por exemplo, se a letra fosse b, ele faria o seguinte, primeira letra é a. A é igual a b, não, false, então continua a próxima elemento. B, B é agora a letra. B é igual a b, verdade, isso aqui é verdadeiro. Então, por isso, ele vai retornar o elemento com o do índice da condição que deu verdadeiro. Nesse caso, será o elemento b, que vai ser retornado aí para todo find e retorno ao elemento, tá? Então, a gente vai ter que fazer isso da mesma maneira aqui.
Nenhum comentário ainda (loading...)
Nenhum comentário ainda (loading...)
Gostou da aula? 😆👍
Apoie nosso trabalho com uma doação: