使用解构赋值和 indexOf() 交换数组值

Question

我正在尝试交换包含数字 0-14 的随机数组中的两个最低值。对于那些好奇的人，我正在为pkpndhere 描述的 15 谜题实现洗牌算法。

我想尝试解构赋值，如 here 所述，但遇到了意外行为。我意识到我可以通过创建一个临时变量来让我的代码工作（并使其更具可读性），但我想在继续之前了解发生了什么。

我正在获取数组[1,2] 的一个子集，然后尝试用[2,1] 替换它。出于某种原因，它仅在原始数组中的顺序与我的子集顺序相反时交换值。

我最初尝试过这个：

var arr1 = [1, 2, 3, 4];
var arr2 = [2, 1, 3, 4];
[arr1[arr1.indexOf(1)], arr1[arr1.indexOf(2)]] = [arr1[arr1.indexOf(2)], arr1[arr1.indexOf(1)]];
[arr2[arr2.indexOf(1)], arr2[arr2.indexOf(2)]] = [arr2[arr2.indexOf(2)], arr2[arr2.indexOf(1)]];
console.log("arr1: " + arr1, "\narr2: " + arr2);

然后尝试了这个：

var arr1 = [1, 2, 3, 4];
var arr2 = [2, 1, 3, 4];
[arr1[arr1.indexOf(1)], arr1[arr1.indexOf(2)]] = [2, 1];
[arr2[arr2.indexOf(1)], arr2[arr2.indexOf(2)]] = [2, 1];
console.log("arr1: " + arr1, "\narr2: " + arr2);

但两者都产生相同的输出：

arr1: 1,2,3,4 
arr2: 1,2,3,4

我希望两个数组的 1 和 2 的位置会交换，但它们只在 arr2 中交换。我怀疑这与他们创建初始数组子集[1,2] 的方式有关，但我不确定。

谁能解释为什么这些值并不总是交换？

Answer 1

结果很简单，因为它对每个解构分配项进行了一步一步。在值发生变化的同时，值的索引也会发生变化。

案例一[1, 2, 3, 4]

1. 获取第一个值2的目标索引

   [arr1[arr1.indexOf(1)], arr1[arr1.indexOf(2)]] = [2, 1];
   //    ^^^^^^^^^^^^^^^                                     0
   

2. 将2 分配给arr1[0]

   [2, 2, 3, 4]
   

3. 获取第二个值1的目标索引：

   [arr1[arr1.indexOf(1)], arr1[arr1.indexOf(2)]] = [2, 1];
   //                           ^^^^^^^^^^^^^^^              0
   

4. 将1 分配给arr1[0]

   [1, 2, 3, 4]
   

案例2[2, 1, 3, 4]

1. 获取第一个值2的目标索引

   [arr2[arr2.indexOf(1)], arr2[arr2.indexOf(2)]] = [2, 1];
   //    ^^^^^^^^^^^^^^^                                     1
   

2. 将2 分配给arr1[1]

   [2, 2, 3, 4]
   

3. 获取第二个值1的目标索引：

   [arr2[arr2.indexOf(1)], arr2[arr2.indexOf(2)]] = [2, 1];
   //                           ^^^^^^^^^^^^^^^              0
   

4. 将1 分配给arr1[0]

   [1, 2, 3, 4]