如何在 JavaScript 中交换两个数组元素?


在本教程中,我们使用不同的方法来交换 JavaScript 中的两个数组元素。例如,我们将数组的第一个和第二个元素交换如下:

输入 -

["first", "second", "third", "fourth", "fifth"]

输出 -

["second", "first", "third", "fourth", "fifth"]

这里我们交换了数组的“第一个”和“第二个”值。

现在我们将看看交换两个元素的不同方法 -

  • 使用额外的变量

  • 使用 Array Splice() 方法

  • 使用解构

方法 1:使用额外变量

在这种方法中,我们将借助一个名为“temp”的额外变量,然后执行以下操作:

  • 我们将第一个元素复制到 temp。

  • 将第二个元素的值复制到第一个元素。

  • 将 temp 的值复制到第二个值。

示例

在下面的程序中,我们使用额外变量交换数组的两个元素。

<!DOCTYPE html>
<html>
<head>
   <title>Swapping two array elements in a single line -TutorialsPoint</title>
</head>
<body>
   <p id = "before">Before swap array elements are:<br> </p>
   <p id="after">After swapping array elements are: <br></p>
   <script>
      var arr=["first", "second", "third", "fourth", "fifth"]
      document.getElementById("before").innerHTML+= arr
      var temp=arr[0];
      arr[0]=arr[1];
      arr[1]=temp;
      document.getElementById("after").innerHTML+=arr
   </script>
</body>
</html>

方法 2:使用 Array Splice() 方法

使用splice(),我们可以实现数组的交换。我们将简单地取出指定位置的元素,然后splice将返回作为值的被移除的数组,最后[0]是数组 splice 方法的必要条件,它表示 splice 将在返回值中返回单个元素。

示例

以下程序演示了如何使用 Array splice 方法交换数组中的两个元素。

<html>
<head>
   <title>Swapping two array elements in a single line -TutorialsPoint</title>
</head>
<body>
   <h3>arr=["first", "second", "third", "fourth", "fifth"]</h3>
   <input type="button" value="Click to Swap" onclick="swap()"/>
   <h3 id="writeHere">After swapping array is:</h3>
   <script>
      function swap(){
         var arr=["first", "second", "third", "fourth", "fifth"]
         x=0, y=1
         var returnFromSplice=arr.splice(y, 1, arr[x])[0]
         arr[0]=returnFromSplice
         document.getElementById("writeHere").innerHTML=JSON.stringify(arr)
      }
   </script>
</body>
</html>

方法 3:使用解构的一行代码

我们可以使用解构来交换数组中的两个元素。交换两个元素的主要逻辑可以在一行中完成。

以下是使用一行代码交换两个数组元素的语法 -

arr[n]=[arr[m], arr[m]=arr[n]][0]

这里 n、m 是要交换的元素的索引。

示例

在一行代码中交换两个元素。

<html>
<body>
   <h3>arr=["first", "second", "third", "fourth", "fifth"]</h3>
   <input type="button" value="Click to Swap" onclick="swap()"/>
   <h3 id="writeHere">After swapping array is:</h3>
   <script>
      function swap(){
         let arr=["first", "second", "third", "fourth", "fifth"]
         arr[0]=[arr[1], arr[1]=arr[0]][0]
         document.getElementById("writeHere").innerHTML=JSON.stringify(arr)
      }
   </script>
</body>
</html>

这里我们将第 0 个元素赋值给第 1 个元素,并使用解构的概念将第 1 个数组元素赋值给第 0 个元素,最后[0]表示将返回一个数组形式的 1 个值,并且它将被交换。

因此,这些是一些我们可以交换两个数组元素的方法,在最后一种方法中,我们只需使用一行代码即可完成工作。

更新于: 2022-07-26

4K+ 次浏览

启动您的 职业生涯

通过完成课程获得认证

开始
广告

© . All rights reserved.