0

alguien me podria decir como hago para que despues de cada movimiento, tenga un travelLog con las coordenadas por las que he pasado, y guardado en mi travelLog array de mi objeto? Obviamente hago rover.travelLog y me da todo el tiempo la coordenada actual, varios arrays pero con las mismas, entiendo porque pasa esto pero no caigo en como guardar las anteriores.

//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>

2
  • quiero que en travelLog se vea [ [0,0] , [1,0] , [2,0] ] Pero obviamente se hace el push de la posicion actual del vehiculo y todo se actualiza, sale esto en rover.travelLog => [ [2,0] , [2,0] , [2,0] ] y lo que quiero ver es por donde ha caminado el vehiculo Commented el 7 mar. 2018 a las 13:43
  • 1
    te recomiendo editar tu pregunta, colocar el codigo mas sencillo de entender, agregar los valores que ingresas que te debe retornar y que te retorna Commented el 7 mar. 2018 a las 13:47

1 respuesta 1

3

En lugar de realizar:

rover.travelLog.push(rover.position);

Copia el arreglo antes de pushiarlo al log:

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

Esto porque de lo contrario simplemente estas guardando la misma referencia del arreglo rover.position en el travelLog

EDICION:

slice() como señala en la documentacion de MDN:

El método slice() devuelve una copia de una parte del array dentro de un nuevo array empezando por inicio hasta fin (fin no incluido). El array original no se modificará.

slice() sin argumentos copia el arreglo desde la posicion 0

3
  • 1
    no entiendo porque un slice ahi... igual tengo que hacer esto en CADA movimiento? ya que depende si esta mirando al sur ete oeste etc, lo debo hacer cada vez? Commented el 7 mar. 2018 a las 13:53
  • 1
    cada vez que pushees en el travelLog quieres que el dato que se guarde ahi no se modifique de forma externa, para eso debes copiar el arreglo que agregas
    – Klaimmore
    Commented el 7 mar. 2018 a las 14:11
  • Los comentarios no deben usarse para discusiones extendidas; esta conversación ha sido trasladada a un chat.
    – Alvaro Montoro
    Commented el 7 mar. 2018 a las 15:25

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.