Obtengo un comportamiento extraño en mi código JS. Cada vez que inserto un objeto en una matriz, cada elemento de la matriz se modifica y se establece en el nuevo objeto que inserto en la matriz.
Estoy configurando el objeto p a x = 0 y y = 0 en la función de configuración al principio.
En el bucle de dibujo, empujo p en la matriz pTrace y llamo a la función nextMove(). Esta función cambia los valores en p. Luego, la función de dibujo se ejecuta nuevamente después de un clic del mouse.
let cols = 3; let rows = 3; //Position let p; //History of Positions let pTrace = []; //Moveset for p let allMoves = [ { x: 0, y: -1 }, { x: 1, y: 0 }, { x: 0, y: 1 }, { x: -1, y: 0 }, ]; //Valid moves based on position let nextMoves = []; function setup() { createCanvas(400, 400); p = { x: 0, y: 0 }; } function draw() { background(150); frameRate(1); //Save position in history pTrace.push(p); //Move p to next position based on valid moves nextMove(); console.log(p); noLoop(); } //Get an array of valid moves for the p position function nextMove() { nextMoves = []; if(py > 0) { nextMoves.push(allMoves[0]); } if(px < cols-1) { nextMoves.push(allMoves[1]); } if(py < rows-1) { nextMoves.push(allMoves[2]); } if(px > 0) { nextMoves.push(allMoves[3]); } let nM = random(nextMoves); px += nM.x; py += nM.y; } //rerun draw loop function mousePressed() { draw(); }Tal vez puedas ayudarme con esto y encontrar mi error. ¡Gracias de antemano, que tengas un gran día!
Eso es porque los objetos en Javascript se pasan por referencia. Siempre está cambiando el mismo objeto p y luego lo empuja a la matriz pTrace .
Desea pasar una copia del objeto p y enviar esa copia a su matriz.
Puede copiar su objeto, por ejemplo, usando el operador de propagación { ...p } o usando Object.assign({}, p)
Algo como esto debería funcionar (ahora se inserta una copia en la matriz pTrace :
let cols = 3; let rows = 3; //Position let p; //History of Positions let pTrace = []; //Moveset for p let allMoves = [ { x: 0, y: -1 }, { x: 1, y: 0 }, { x: 0, y: 1 }, { x: -1, y: 0 }, ]; //Valid moves based on position let nextMoves = []; function setup() { createCanvas(400, 400); p = { x: 0, y: 0 }; } function draw() { background(150); frameRate(1); //Save position in history pTrace.push({ ...p }); // push a copy //Move p to next position based on valid moves nextMove(); console.log(p); noLoop(); } //Get an array of valid moves for the p position function nextMove() { nextMoves = []; if(py > 0) { nextMoves.push(allMoves[0]); } if(px < cols-1) { nextMoves.push(allMoves[1]); } if(py < rows-1) { nextMoves.push(allMoves[2]); } if(px > 0) { nextMoves.push(allMoves[3]); } let nM = random(nextMoves); px += nM.x; py += nM.y; } //rerun draw loop function mousePressed() { draw(); }