JavaScript修改對象屬性的方法中的變量？

Question

我正在嘗試在JavaScript中創建一個撲克遊戲。我認爲測試沖洗的功能非常完美，直到我在方法運行後顯示手。如果存在沖水，則此功能應顯示用戶的全手，然後僅顯示其下方的沖水。相反，它只顯示沖洗，然後沖洗再次在它之下：

var $ = function (id) { return document.getElementById(id); }; 
 

 
var test = function() { 
 
    var deck = new POKER.Deck(); //creates deck 
 
    var hand = new POKER.Hand(); //creates hand 
 
    //----------------TEST HAND UNTIL FLUSH----------------- 
 
    while (hand.getValue() != POKER.HAND_TYPE.FLUSH) { 
 
     deck.refreshDeck(); //refresh deck with new cards 
 
     for (var i = 0; i < 7; ++i) { //populate hand 
 
      hand.addCard(deck.dealCard()); 
 
     } 
 

 
     console.log(hand.size() + " before"); //only for debugging. Prints "7 before" 
 
     hand.testFlush(); 
 
     console.log(hand.size() + " after"); //only for debugging. Result unexpected 
 

 
     if (hand.getValue() == POKER.HAND_TYPE.FLUSH) { //if hand has a flush 
 
      for (var j = 0; j < hand.size(); j++) { //display full hand 
 
       var img = document.createElement("img"); 
 
       var card = hand.getCardAtIndex(j); 
 
       img.src = card.getImage(); 
 
       $("images").appendChild(img); 
 
      } 
 
      for (var k = 0; k < 5; k++) { //display flush hand 
 
       var img2 = document.createElement("img"); 
 
       var card2 = hand.getValueCardAtIndex(k); 
 
       img2.src = card2.getImage(); 
 
       $("handImg").appendChild(img2); 
 
      } 
 
      break; 
 
     } else { 
 
      hand.empty(); 
 
     } 
 
    } 
 
    
 
}; 
 

 
window.onload = function() { 
 
    test(); 
 
};

第二的console.log語句打印出「4後」，直到testFlush方法檢測沖洗，並最後的結果是「5之後」。

testFlush方法：在測試功能

POKER.Hand.prototype.testFlush = function() { 
 
    //first, sort cards by rank so that the highest flush is 
 
    //taken if there are more than five cards of the same suit 
 
    this.sortByRank(); 
 
    this.sortBySuit(); 
 
    var tempHand = this.cards; //modifiable version of this.cards 
 
    var NUM_OF_TESTS = 3; //only 3 loops required to test for all possible flushes 
 
    var LAST_CARD_INDEX = 4; //represents the fifth card, or index 4 
 
    var MAX_CARDS = 5; //maximum cards possible in a hand (valueCards) 
 

 
    for (var i = 1; i <= NUM_OF_TESTS; i++){ 
 
     //check if 1st and 5th cards are the same suit 
 
     if(tempHand[0].getSuit() == tempHand[LAST_CARD_INDEX].getSuit()){ 
 
      this.value = POKER.HAND_TYPE.FLUSH; 
 
      while(tempHand.length != MAX_CARDS){ //remove last card in tempHand until there are only five cards 
 
       tempHand.pop(); 
 
      } 
 
      this.valueCards = tempHand; 
 
     }else{ 
 
      tempHand.splice(0,1); //removes first card from the temporary hand 
 
     } 
 
    } 
 
};

全部 「hand.size（）」 的作用是 「返回this.cards.length」。所以我不明白的是，當testFlush方法只改變臨時變量tempHand時，如何改變對象屬性「this.cards」。

手對象：

POKER.Hand = function(){ 
 
    this.cards = []; 
 
    this.value; //integer that corresponds to the POKER.HAND_TYPE 
 
    this.valueCards = []; //array of the five cards that corresponds only to this.value 
 
};

Hand.size方法：

POKER.Hand.prototype.size = function() { 
 
    return this.cards.length; 
 
};

Answer 1

問題是這樣的線：

var tempHand = this.cards; //modifiable version of this.cards 

將一個數組或對象賦值給一個變量不會創建它的副本。該變量是對同一個數組的引用，所以tempHand.pop()也修改this.cards。您可以使用.slice()製作一個陣列的副本：

var tempHand = this.cards.slice();