JavaScript卡片遊戲玩家手的體系結構

Question

所以，我正在嘗試簡單的紙牌遊戲。我有player「類」與draw函數，並且公共成員deck和hand，都是數組。

我需要從甲板上抽出一張牌，放在手中，並顯示在玩家「手」區域。我擔心我「翻轉」和「播放」按鈕的方式（通過關閉）。

下面是代碼：

littlegame.player.prototype.draw = function() { 
    if (this.canDrawCard()) { 
     var card = this.deck.draw(); // this.deck is Array 

     //Create card element on the playfield 

     var card_object = $('<div class="card"></div>').append($('<span class="attack">' + card.attack + '</span>')).append($('<span class="defence">' + card.defence + '</span>')); 

     // Add controls to card 
     if (this.playerid == 1) { 
      var flipper = $('<span class="flip">Flip</span>'); 
      flipper.click(function(){ 
       card.flip(); 
      }); 

      var actuator = $('<span class="play">Play</span>'); 
      console.log('Loading actuator closure with id ' + this.playerid + ' and name ' + this.playername); 
      var player = this; 

      var old_hand = this.hand.slice(0); // Store a copy of old hand. Stupid trick, i know. It doesn't work 

      actuator.click(function(){ 
       card.play(player.playerid); 
       delete card; 
       player.hand = old_hand; 
      }); 

      card_object = card_object.append(flipper).append(actuator); 
     } 

     this.element.append(card_object); 
     card.element = card_object; 

     // Put card in hand 
     this.hand.push(card); 
    } 
}; 

我需要的是一個方法來調用card.play()和card.flip()上相應的按鈕按下，用card.play知道在手卡位，將卡取出。我怎樣才能做到這一點？

Answer 1

littlegame.player.prototype.draw = function() { 
     if (this.canDrawCard()) { 
       var card = this.deck.draw(); // this.deck is Array 

       //Create card element on the playfield 

       var card_object = $('<div class="card"></div>').append($('<span class="attack">' + card.attack + '</span>')).append($('<span class="defence">' + card.defence + '</span>')); 

       // Add controls to card 
       if (this.playerid == 1) { 
         var flipper = $('<span class="flip">Flip</span>'); 
         flipper.click(function(){ 
           card.flip(); 
         }); 

         var actuator = $('<span class="play">Play</span>'); 
         console.log('Loading actuator closure with id ' + this.playerid + ' and name ' + this.playername); 
         var player = this; 

         var old_hand = this.hand.slice(0); // Store a copy of old hand. Stupid trick, i know. It doesn't work 

         actuator.click(function(){ 
           card.play(player.playerid); 
           delete card; 
           player.hand = old_hand; 
         }); 

         card_object = card_object.append(flipper).append(actuator); 
       } 

       this.element.append(card_object); 
       card.element = card_object; 

       // Put card in hand 
       this.hand.push(card); 
       var hand = this.hand; 
       card.remove = function() { 
        var i; 
        for(i=0;i<hand.length;i++) { 
         if(hand[i]===this) { 
          hand.splice(i,1); 
         } 
        } 
       } 
     } 
}; 

這裏的關鍵是在包含您感興趣的變量的作用域定義刪除功能。在這裏，我定義變量hand，這使得它可我後立即定義刪除函數內。隨後可以隨時調用remove函數。 如果你知道牌不會改變手牌的位置，你可以通過使索引有些變量（比如cardposition）並簡單地將你的數組拼接到那裏，或者你想要對陣列進行任何操作。

Answer 2

我嘗試了以下。我不得不將卡牌放在關卡中，連同玩家和卡片本身的鏈接。它是這樣的：

littlegame.player.prototype.draw = function() { 
    if (this.hand.length < this.agility) { 
     var card = this.deck.draw(); 

     // Put card in hand 
     this.hand.push(card); 

     var card_in_hand = this.hand[this.hand.length - 1]; 
     var card_position = this.hand.length; 

     //Create card element on the playfield 
     var card_object = $('<div class="card"></div>').append($('<span class="attack">' + card.attack + '</span>')).append($('<span class="defence">' + card.defence + '</span>')); 

     // Add controls to card 
     if (this.playerid == 1) { 
      var flipper = $('<span class="flip">Flip</span>'); 
      flipper.click(function(){ 
       card_in_hand.flip(); 
      }); 

      var actuator = $('<span class="play">Play</span>'); 
      console.log('Loading actuator closure with id ' + this.playerid + ' and name ' + this.playername); 
      var player = this; 

      actuator.click(function(){ 
       card_in_hand.play(player.playerid); 
       player.hand.remove(card_position); 
      }); 

      card_object = card_object.append(flipper).append(actuator); 
     } 


     this.element.append(card_object); 
     card_in_hand.element = card_object; 
    } 
}; 

我也是從約翰Resig的使用Array.remove()function。