Drag of arrays in this game is not going

Question

Drag of arrays in this game is not going

Navigation

#1 by (3 votes)

0

Can someone tell me what I do so that after each movement, I have a travelLog with the coordinates I passed, and saved in my travelLog array of my object? Obviously I do rover.travelLog and it gives me all the time the current coordinate, several arrays but with the same, I understand why this happens but I do not fall in how to save the previous ones.

//UPDATE INFO
$(document).ready(function() {
  setTimeout(messages, 1000);
});

function messages() {
  let mensajeDireccion = document.getElementById('direction').textContent = 'rover is facing ' + rover.direction;
  let mensajePosicion = document.getElementById('direction2').textContent = rover.position[0] + ',' + rover.position[1];
}

//ROVER GRID
let grid = [
  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
  [0, 1, 2, 3, 'o', 5, 6, 7, 8, 9],
  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
  [0, 1, 2, 3, 4, 5, 'o', 7, 8, 9],
  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
  [0, 1, 'o', 3, 4, 5, 6, 7, 8, 9],
  [0, 1, 2, 3, 4, 5, 'o', 7, 8, 9],
  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
];


//ROVER OBJECT
let rover = {
  direction: 'N',
  position: [0, 0],
  travelLog: []
};


//LOGIC DECISSIONS
document.getElementById("decision").onkeyup = function(e) {

  let texto = e.target.value;

  let textoSanedo = texto.replace(" ", "").toUpperCase();

  e.target.value = textoSanedo;

  let commands;
  for (var i = 0; i < textoSanedo.length; i++) {
    commands = textoSanedo[i];
  }

  switch (commands) {
    case 'L':
      forward(rover);
      break;
    case 'R':
      turnRight(rover);
      break;
    case 'F':
      moveForward(rover);
      break;
    case 'B':
      moveBackwards(rover);
      break;
  }
  // console.log(rover.position);
  // console.log(rover.travelLog);

  // for (var j = 0; j < rover.position.length; j++) {
  //   // rover.travelLog.push(rover.position[i]);
  //   console.log(rover.position[i]);
  // }

  if (rover.position[0] < 0 || rover.position[0] > 9 || rover.position[1] < 0 || rover.position[1] > 9) {
    alert('out');
  }
  return;
};



//TURN LEFT
function turnLeft(rover) {
  switch (rover.direction) {
    case 'N':
      rover.direction = 'W';
      break;
    case 'W':
      rover.direction = 'S';
      break;
    case 'S':
      rover.direction = 'E';
      break;
    case 'E':
      rover.direction = 'N';
      break;
  }
  messages();
}

//TURN RIGHT
function turnRight(rover) {
  switch (rover.direction) {
    case 'N':
      rover.direction = 'E';
      break;
    case 'E':
      rover.direction = 'S';
      break;
    case 'S':
      rover.direction = 'W';
      break;
    case 'W':
      rover.direction = 'N';
      break;
  }
  messages();
}

//MOVE FORWARD
function moveForward(rover) {
  switch (rover.direction) {
    case 'N':
      rover.position[0]--;

      break;
    case 'W':
      rover.position[1]--;

      break;
    case 'S':
      rover.position[0]++;

      break;
    case 'E':
      rover.position[1]++;

      break;
  }
  rover.travelLog.push(rover.position);
  messages();
}

//MOVE BACKWARDS
function moveBackwards(rover) {
  switch (rover.direction) {
    case 'N':
      rover.position[0]++;

      break;
    case 'W':
      rover.position[1]++;


      break;
    case 'S':
      rover.position[0]--;

      break;
    case 'E':
      rover.position[1]--;

      break;
  }
  rover.travelLog.push(rover.position);
  messages();
}

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>rover</title>
</head>

<body>
  <input id="decision" type="text" name="" value="" placeholder="l: Left, r: Right, f: Forward, b: Backwards">
  <p id="direction"></p>
  <p id="direction2"></p>

  <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  <script src="js/app.js" charset="utf-8"></script>
</body>

</html>

javascript html

asked by francisco dwq 07.03.2018 в 13:59

source

1 answer

How to make a text box appear when flying over the options of a menu in html5? Error installing gem "mongo"

score 3 · Accepted Answer

Instead of performing:

rover.travelLog.push(rover.position);

Copy the fix before pushing it to the log:

rover.travelLog.push(rover.position.slice());

This is because otherwise you are simply saving the same array reference rover.position in the travelLog

EDIT:

slice() as noted in the MDN documentation :

The slice () method returns a copy of a part of the array within a new array starting from start to end (end not included). The original array will not be modified.

slice() without arguments copies the array from the 0 position