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();