javascript - 给对象属性一个数组值？

Question

我有以下代码，我想使牌组阵列充满 52 张不同的牌。每当我运行代码并提醒卡片对象时，它都会显示为“[object Object]”。

有人可以向我解释为什么这样做以及解决这个问题的方法吗？

var suits = ["Clubs", "Diamonds", "Hearts", "Spades"];
var ranks = ["A", 2, 3, 4, 5, 6, 7, 8, 9, 10, "J", "Q", "K"];
var deck = []; 

for (var i = 0; i < suits.length; i++) {
    for (var j = 0; j < ranks.length; j++) {
        var card = {rank: ranks[j], suit: suits[i]};
        deck.push(card);
        alert(card)
    }
}

Answer 1

为什么这样做

这是完全正常的。当您执行 alert() 时，您创建的卡片对象不知道如何表示自己，原因很简单，因为没有 toString() 方法实现。

您的问题的解决方案

尝试为每个卡片对象指定匿名toString() 函数实现，如下所示:

var suits = ["Clubs", "Diamonds", "Hearts", "Spades"];
var ranks = ["A", 2, 3, 4, 5, 6, 7, 8, 9, 10, "J", "Q", "K"];
var deck = []; 

for (var i = 0; i < suits.length; i++) {
    for (var j = 0; j < ranks.length; j++) {

        var card = {
                       rank: ranks[j], 
                       suit: suits[i],
                       toString : function() { return this.rank + ' ' + this.suit; }
                   };

        deck.push(card);

        //alert(card); // console.log doesn't block code execution
        console.log(card.toString());
    }
}

注意

您应该考虑使用 console.log() 而不是 alert() 因为它不那么烦人并且更容易在控制台中调试(按 F12)。但要小心运行 IE9 或更低版本的生产代码，因为当开发人员控制台未打开时，它们的 javascript 引擎会崩溃。