Javascript new function-object vs function-instantiation

Question

我创建了一副包含 52 个卡片对象的数组的卡片。每个卡都继承 cardObject（） 函数中定义的属性和方法。但是，我对如何创建新甲板并访问其属性和方法感到困惑。

// Defining properties and methods for every single card object created by PackOfCards function
function cardObject(cardNum, cardSuit) {
  this.cardNum = cardNum;
  this.cardSuit = cardSuit;
}
cardObject.prototype.getCardValue = function() {
  if (this.cardNum === "jack" || this.cardNum === "queen" || this.cardNum === "king") {
    return 10;
  } else if (this.cardNum === "ace") {
    return 11;
  } else {
    return this.cardNum;
  }
}
cardObject.prototype.getCardSuit = function() {
    return this.cardSuit;
  }
// Creating a deck of shuffled card where every card inherits properties and methods defined in cardObject function
function PackOfCards() {
  var unshuffledDeck = [],
    shuffledDeck = [];
  var listCardNum = ["ace", 2, 3, 4, 5, 6, 7, 8, 9, 10, "jack", "queen", "king"];
  var listCardSuits = ["clubs", "diamonds", "hearts", "spades"];
  for (var i = 0; i < listCardNum.length; i++) {
    for (var j = 0; j < listCardSuits.length; j++) {
      unshuffledDeck.push(new cardObject(listCardNum[i], listCardSuits[j])); //generating 52 new card objects
    }
  }
  var lengthCounter = unshuffledDeck.length;
  while (lengthCounter > 0) { // shuffling the 52 unshuffled cards randomly
    var tempPosition = Math.floor(Math.random() * lengthCounter);
    shuffledDeck.push(unshuffledDeck.splice(tempPosition, 1));
    lengthCounter--
  }
  return shuffledDeck;
}
var newDeckObj = new PackOfCards;  // I've considered PackOfCards as constructer function here
var newDeckInstance = PackOfCards();  // I've created a variable that stores a new instance of PackOfCards() function that returns an array
console.log(newDeckObj[5].getCardValue);
console.log(newDeckObj[5].getCardValue);

在这里，我无法找到newDeckObj和newDeckInstance之间真正真正的核心区别。

两者都包含一个包含 52 个对象的数组，但我在尝试访问其属性时未定义。我想这两个变量都是 PackOfCards（） 函数的一些副本，但采用不同的方法（一个认为它是一个构造函数，另一个只是一个返回数组的函数），我无法完全理解。

Answer 1

你从PackOfCards构造函数返回了一个对象，所以它不再是构造函数。无论是否使用new都没有区别;它应该只是一个正常的功能。

记录

undefined的原因是因为拼接返回一个已删除项目的数组，而不仅仅是一个（即使您只拼接了一个项目）。

shuffledDeck.push(unshuffledDeck.splice(tempPosition, 1)[0]);

不过，将洗牌的过程移动到另一个函数中并就地执行将是一个好主意;它允许您自行测试洗牌部分。

function shuffle(collection) {
    for (var i = 0; i < collection.length - 1; i++) {
        var swap = i + (Math.random() * (collection.length - i) | 0);
        var t = collection[i];
        collection[i] = collection[swap];
        collection[swap] = t;
    }
}

和

function getPackOfCards() {
  var deck = [];
  var listCardNum = ["ace", 2, 3, 4, 5, 6, 7, 8, 9, 10, "jack", "queen", "king"];
  var listCardSuits = ["clubs", "diamonds", "hearts", "spades"];
  for (var i = 0; i < listCardNum.length; i++) {
    for (var j = 0; j < listCardSuits.length; j++) {
      deck.push(new cardObject(listCardNum[i], listCardSuits[j])); //generating 52 new card objects
    }
  }
  return deck;
}
var deck = getPackOfCards();
shuffle(deck);