如何在 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