在JavaScript中與原型/繼承奮鬥

Question

我有一個小練習項目，我正在開發一個21點遊戲。我爲面向對象的目的使用JS原型，迄今爲止效果很好。我有一個遊戲，卡牌和手牌（玩家擁有的所有牌）原型對象。 現在我的手原型有問題。 它返回我的卡片值「未定義」。我不知道什麼是錯，因爲我的手構造函數返回正確的值。

我不得不承認我對JS原型的理解可能不是最好的，所以這可能是我正在努力的問題？！

這是從我的代碼中的相關片段：

var suits = ["club", "diamond", "heart", "spade"]; 
var cardValue = ["ace", 2, 3, 4, 5, 6, 7, 8, 9, "jack", "queen", "king"]; 

function Game() { 
} 

Game.prototype = { 

    deal: function() { 
     var cardSuit = Math.floor(Math.random() * suits.length); 
     var cardNumber = Math.floor(Math.random() * cardValue.length); 

     return cardSuit, cardNumber; 
    }, 


    createHand: function() { 
     var newHand = new Hand(); 
     var userCards = newHand.getHand(); 

     return newHand; 
    } 

}; 

var card1, card2, handCards; 

function Hand() { 
    var card1 = Game.prototype.deal(); //works! return two values 
    var card2 = Game.prototype.deal(); //works! return two values 
    var handCards = [card1, card2]; //works! creates array from card 1 and 2 
} 

Hand.prototype = { 

    getFirstCard: function() { 
     return card1; // IS "UNDEFINED"! 
    }, 

    getSecondCard: function() { 
     return card2; // IS "UNDEFINED"! 
    }, 

    getHand: function() { 
     return handCards; // IS "UNDEFINED"! 
    } 
}; 

你能幫幫我嗎？非常感謝您提前！

Answer 1

您聲明一些全局變量，不會分配值：

var card1, card2, handCards; 

然後在小時Hand()函數聲明是當地該函數同名的變量：

function Hand() { 
    var card1 = Game.prototype.deal(); 
    // etc. 

然後您的其他函數嘗試訪問從未分配過值的全局變量：

getFirstCard: function() { 
    return card1; // IS "UNDEFINED"! 
}, 

如果你想從你的「類」的方法來訪問這些值這些變量應該是實例變量：

function Hand() { 
    this.card1 = Game.prototype.deal(); //works! return two values 
    this.card2 = Game.prototype.deal(); //works! return two values 
    this.handCards = [this.card1, this.card2]; //works! creates array from card 1 and 2 
} 
... 
getFirstCard: function() { 
    return this.card1; 
}, 

...等在使用這些變量的其他方法。您可以刪除var card1, card2, handCards;行。

或者它可能是整潔做到這一點：

function Hand() { 
    this.handCards = [Game.prototype.deal(), Game.prototype.deal()]; 
} 
... 
getFirstCard: function() { 
    return this.handCards[0]; 
}, 
getSecondCard: function() { 
    return this.handCards[1]; 
}, 

（還有其他的問題，在你的代碼，例如：

• 您cardValue陣列丟失10
• return cardSuit, cardNumber;只返回cardNumber
• 你的createHand()函數聲明並設置一個userCards變量從未使用
• 我不明白這一點在具有Game()構造函數，如果你從來沒有任何實例化對象Game，只是調用原型的方法，如Game.prototype.deal()
• 你沒有保持跟蹤的什麼卡留在甲板上，所以（但不太可能）隨機選卡可以處理相同的卡兩次

...等等。）