如何在 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 个值,并且它将被交换。
因此,这些是一些我们可以交换两个数组元素的方法,在最后一种方法中,我们只需使用一行代码即可完成工作。
广告
数据结构
网络
关系数据库管理系统
操作系统
Java
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP