Javascript变量修改后的最后一个值

Question

这是我的训练:

    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    document.getElementById("demo").innerHTML = fruits;
    
    function myFunction() {
        var fruits2 = fruits;
        fruits2.reverse();
        document.getElementById("demo").innerHTML = fruits+'<br>'+fruits2;
    }

<p>Click the button to reverse only last array (fruits2).</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>

当我反转fruits2时，我的第一个变量(水果)也会改变，

我只是不想这样!我想一定很简单

Answer 1

fruits2 = fruits说fruits2现在是相同的对象-不是fruits的副本，而是与fruits相同的对象。

这就像给你的朋友哈利起个外号，比如疯狗。当你打疯狗时，哈利也会生气。他们不是两个独立的人，他们是一个人，有两种称呼他的方式。

你需要克隆你的数组，如果你想保持他们分开。最简单的复制数组的方法是使用slice:

 var fruits2 = fruits.slice()

Answer 2

这是因为您的fruits和fruits2是相同的数组。当你反转一个时，第二个也会反转。

你需要再复制一个数组。一个简单的方法是

var fruits2 = JSON.parse(JSON.stringify(fruits));

或

var fruits2 = fruits.slice()

    var fruits = ["Banana", "Orange", "Apple", "Mango"];
    document.getElementById("demo").innerHTML = fruits;
    
    function myFunction() {
        var fruits2 = fruits.slice()
        fruits2.reverse();
        document.getElementById("demo").innerHTML = fruits+'<br>'+fruits2;
    }

<p>Click the button to reverse only last array (fruits2).</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>