I am doing my first code project and I am having some problems with arrays changing their values apparently on their own
console.log(permanentDeck) should return 7 cards, but they seem to have been taken off
I’ve checked more than once for any line that changes permanentDeck value, but didnt find none
Can someone help me figure out in which line this happens??
var playerClass = "Warrior"
const examcard1 = {id:1, cost: 1, name:"Slash", text:"Deal 100% damage"}
const examcard2 = {id:2, cost: 1, name:"Block", text:"Gain 1 block"}
const examcard3 = {id:3, cost: 2, name:"Heavy Strike", text:"Deal 200% damage\nApply 1 vunerable"}
const starterWarriorDeck = [examcard1, examcard1, examcard1, examcard2, examcard2, examcard2, examcard3]
var deck
var permanentDeck = []
switch(playerClass){
case "Warrior":
permanentDeck = starterWarriorDeck
}
var drawPile = []
var hand = []
function shuffle(array){
let currentIndex = array.length, randomIndex;
// While there remain elements to shuffle.
while (currentIndex != 0) {
// Pick a remaining element.
randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex--;
// And swap it with the current element.
[array[currentIndex], array[randomIndex]] = [
array[randomIndex], array[currentIndex]];
}
return array;
}
function restockDrawPile(){
drawPile = shuffle(deck);
}
function startBattle(){
deck = permanentDeck;
restockDrawPile();
}
function startPlayerTurn(){
drawCards(5)
}
function drawCards(cardsToDraw){
for(i = 0; i < cardsToDraw; i++){
let nextCard = drawPile.pop();
hand.push(nextCard);
}
}
var handView = new PIXI.Container()
startBattle();
startPlayerTurn();
console.log(permanentDeck);
console.log(deck);
console.log(drawPile);
console.log(hand);
´´´
>Solution :
if you add console.log(starterWarriorDeck);, you’ll find that it has been modified as well. This is because arrays are passed by reference, so in the following lines, you’re not making a copy of the array, just another reference to the same array:
permanentdeck = starterWarriorDeck;
deck = permanentdeck;
console.log(Object.is(deck, starterWarriorDeck)) // true
You need to explicitly copy the contents into the new array. There are multiple methods of doing a shallow copy in JS, but the clearest ones in this case would be to use the spread operator … , or the .from method.
Examples:
permanentDeck = [...starterWarriorDeck]
deck = Array.from(permanentDeck)
Relevant info:
https://www.freecodecamp.org/news/how-to-clone-an-array-in-javascript-1d3183468f6a/