javascript - 在 javascript 中更改数组变量也会更改代码中较早点的数组值

Question

我正在尝试制作纸牌游戏模拟器，但我的套牌阵列有问题。

let colors = ["heart","diamond","spade","club"];
let numbers = ["ace","2","3","4","5","6","7","8","9","10","jack","queen","king"];

function createDeck(){
  let card = {};
  let counter = 0;
  let cards = [];
  for (let i = 0; i<colors.length;i++){
    for (let j = 0; j<numbers.length; j++){
        card = {
        color: colors[i],
        number: numbers[j]
      }
      cards[counter] = card;
      counter ++;
    }
  }
  return cards;
}

function shuffle(array){
  for(let i = array.length -1; i > 0; i--){
    const j = Math.floor(Math.random() * i)
    const temp = array[i]
    array[i] = array[j]
    array[j] = temp
  }
}

let deck = createDeck();
console.log(deck);
shuffle(deck);
console.log(deck);

两个控制台日志都输出打乱后的数组。

我试过用另一个数组来测试它，然后它就可以工作了。

let test = [1,2,3]
console.log(test);
shuffle(test);
console.log(test);

这首先输出未打乱的数组，然后是打乱的数组。

Answer 1

数组 是引用(通过引用寻址，see also)，所以你对它的一个实例所做的一切都会改变它。如果您想保留原始数组，您应该对deck 的副本 进行随机播放。

let colors = ["heart","diamond","spade","club"];
let numbers = ["ace","2","3","4","5","6","7","8","9","10","jack","queen","king"];

function createDeck(){
  let card = {};
  let counter = 0;
  let cards = [];
  for (let i = 0; i<colors.length;i++){
    for (let j = 0; j<numbers.length; j++){
        card = {
        color: colors[i],
        number: numbers[j]
      }
      cards[counter] = card;
      counter ++;
    }
  }
  return cards;
}

function shuffle(array){
  for(let i = array.length -1; i > 0; i--){
    const j = Math.floor(Math.random() * i)
    const temp = array[i]
    array[i] = array[j]
    array[j] = temp
  }
  return array;
  // ^ the copy should be returned
}

let deck = createDeck();
console.log(deck.slice(0, 3));
const shuffled = shuffle(deck.slice(0));
//                       ^ this creates a copy of deck
console.log(shuffled.slice(0, 3));

.as-console-wrapper { top: 0; max-height: 100% !important; }