如何在不更改原始阵列的情况下复制阵列并使用副本？

Question

我在Google上搜索了很多，我知道可以复制数组并使用它们而不影响原始数组，但是我确实做了很多尝试，但在我的特定代码行上似乎没有任何作用。

我正在做一个简单的记忆游戏。当用户正确配对时，将在右侧屏幕上显示匹配对的图像，显​​示用户获得的所有匹配图像。下图显示了该图像，但是当我使用一种方法来调整图像的大小（匹配的对数小于普通游戏卡）时，我选择的卡中未定义cardState。

下面是一堆代码，可以帮助您解决我的问题：

   checkCardSelection(_cardSelectionArray,_position){
    var _cardArray = this.state.cardArray;
    var _matchedcardArray = this.state.matchedcardArray;
    console.log("Position:" +_position)
    if(_cardSelectionArray[0].cardType === _cardSelectionArray[1].cardType){
        var copy = _cardSelectionArray.slice(0,1)
        _matchedcardArray.push(copy)
       _matchedcardArray[_matchedcardArray.length-1].cardState = this.renderMatchedImage(_matchedcardArray[_matchedcardArray.length-1].cardType)
 this.setState({ cardArray: _cardArray, matchedcardArray: _matchedcardArray });


renderMatchedImage(cardType) {
switch(cardType) {
case 'A':
  return <img src={imagem1} alt="Raposa" width="49px" height="70px"/>;
case 'B':
  return <img src={imagem2} alt="Cobra" width="49px" height="70px"/>;
case 'C':
  return <img src={imagem3} alt="Galinha" width="49px" height="70px"/>;
        // and so on...

MatchedCardArray是一个空数组，一旦配对就可以获取卡片

CardSelectionArray是一个双值数组，其中选择了两对

每张卡都有一个CardType（A，B，C，D等）和一个CardState（“不可见”或返回的图像）。将它们与功能随机化。例如，CardArray可能是：

0: {cardType: "G", cardState: "INVISIBLE"}
1: {cardType: "B", cardState: "INVISIBLE"}
2: {cardType: "A", cardState: "INVISIBLE"}

Answer 1

据我所知，没有标准方法可以在JavaScript中深度复制对象数组。如果您需要对包含“简单”对象（简单意味着没有函数等）的数组进行深层复制，则可以使用以下简单技巧：

const newArray = oldArray.map(item => JSON.parse(JSON.stringify(item)));

要复制原始数组，您可以使用更简单的方法：

const newArray = oldArray.slice();

更新（经过评论讨论）：

如果您需要复制浅对象数组（所有属性都指向原始值），则以下方法可能会比JSON.parse / stringify提供更好的性能：

const newArray = oldArray.map(item => Object.assign({}, item));

Answer 2

您可以使用es6功能轻松做到这一点

let variable=[...yourarray]