Infinite variable (javascript)

Question

Infinite variable (javascript)

Navigation

#1 by (2 votes)

2

I'm programming on: link

The exercise: whenever the user presses the 'A' key a random number between 1 and 6 is assigned as well as if the 'B' key is pressed. I need to make a comparison between these two numbers in order to figure out which is the largest and assign 1 point to the user who pressed the 'A' or 'B' key respectively.

What happens to me is that when I press the key, the points part increases the score infinitely, even before the second user has pressed his key and the computer has made the comparison.

var s = "Pontos A";
var r = "Pontos B";
var d1 = 0;
var d2 = 0;
var pontosA = 0;
var pontosB = 0;

function setup() {
  createCanvas(400, 400);

}

function keyPressed() {
  if (keyCode === 65) {
    d1 = 1 + int((6 - 1 + 1) * random());
  } else if (keyCode === 66) {
    d2 = 1 + int((6 - 1 + 1) * random());
  }
  return false;
}

function draw() {
  if (d1 > d2) {
    pontosA = pontosA + 1;
  }
  if (d2 > d1) {
    pontosB = pontosB + 1;
  }
  background(220);
  text(s, 50, 10, 70, 80);
  text(r, 300, 10, 80, 80);

  text(pontosA, 60, 50);
  text(pontosB, 320, 50);
  text(d1, 60, 100);
  text(d2, 320, 100);
}

javascript

asked by anonymous 03.05.2018 / 00:11

1 answer

How to catch mysql (duplicate entry) error and display a message on screen for the user, using codeigniter? Script captcha generator in PHP does not generate the image

score 2 · Accepted Answer

In the editor you mentioned, link , the draw function runs several times per second, whenever you need to refresh until then. Therefore it can not update the points in it, otherwise it updates innumerable times without user interaction.

The ideal location for this update would then be the keyPressed function, which executes only once when the user presses the key. Carrying your point update code to the keyPressed function already works:

function keyPressed() {
  if (keyCode === 65) {
    d1 = 1 + int((6 - 1 + 1) * random());

    //atualiza aqui
    if (d1 > d2) { 
        pontosA = pontosA + 1;
    }
    if (d2 > d1) {
        pontosB = pontosB + 1;
    }
  } else if (keyCode === 66) {
    d2 = 1 + int((6 - 1 + 1) * random());

    //e aqui também
    if (d1 > d2) {
        pontosA = pontosA + 1;
    }
    if (d2 > d1) {
        pontosB = pontosB + 1;
    }
  }
  return false;
}

function draw() {
  //sem atualização de pontos aqui
  background(220);
  text(s, 50, 10, 70, 80);
  text(r, 300, 10, 80, 80);

  text(pontosA, 60, 50);
  text(pontosB, 320, 50);
  text(d1, 60, 100);
  text(d2, 320, 100);
}

Note, however, that there is a certain logic repeated in the code. Whenever you see yourself repeating code it is because you have a better way of writing it. In this case a better solution would be to turn that repeated code into a function that can call either the user A or B :

function atualizaPontos(){
  if (d1 > d2) {
    pontosA = pontosA + 1;
  }
  else if (d2 > d1) { //else if em vez de if
    pontosB = pontosB + 1;
  }
}

function keyPressed() {
  if (keyCode === 65) {
    d1 = 1 + int((6 - 1 + 1) * random());
    atualizaPontos(); //atualização dos pontos aqui
  } else if (keyCode === 66) {
    d2 = 1 + int((6 - 1 + 1) * random());
    atualizaPontos(); //atualização dos pontos aqui
  }
  return false;
}

Personally I would still take another step towards turning the random number generation into a function as well. This step makes the code simpler, clearer and reusable:

function aleatorioEntre(min, max){
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

function keyPressed() {
  if (keyCode === 65) {
    d1 = aleatorioEntre(1, 6); //gera aleatório de 1 a 6
    atualizaPontos();
  } else if (keyCode === 66) {
    d2 = aleatorioEntre(1, 6); //gera aleatório de 1 a 6
    atualizaPontos();
  }
  return false;
}