資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法學如何在JavaScript中用另一個數組的元素替換陣列中的元素？
給定的任務是用另一個數組的元素替換陣列中的元素。
輸入-輸出場景
讓我們來看一些輸入-輸出場景。假設有兩個包含元素的陣列。第一個陣列的元素比第二個陣列多，我們用第二個陣列的元素替換第一個陣列的一部分元素。
Array1 = [1, 3, 5, 7, 2, 4]; Array2 = [3, 6]; Output = [3, 6, 5, 7, 2, 4] // elements got replaced
讓我們考慮另一種情況，其中第一個陣列中的元素多於第二個陣列中的元素。第二個陣列的元素將填充第一個陣列。
Array1 = [3, 6]; Array2 = [1, 3, 5, 7, 2, 4]; Output = [1, 3, 5, 7, 2, 4]
使用splice()方法
splice() 方法透過替換或刪除元素以及新增元素來修改或更改陣列的專案。
語法
以下是splice()方法的語法：
splice(start, deleteCount, item1, item2, itemN)
我們可以使用splice() 方法用另一個數組的元素替換陣列的一部分元素。但在這種情況下，我們需要將元素作為引數傳遞，而不是將陣列作為引數傳遞。
為了完成上述任務，splice() 方法除了引數如 (0, anotherArr.Length, 1, 2, 3) 之外，我們需要建立一個包含上述引數的陣列，並使用apply方法來呼叫帶有引數的splice方法。我們還使用concat() 方法來連線兩個陣列。
以下是上述預期引數的語法：
Array.prototype.splice.apply(arr, [0, anotherArr.length].concat(anotherArr));
示例1
以下是一個用另一個數組的元素替換一個數組中的元素的示例：
<!DOCTYPE html> <html> <head> <title>Replace elements in array with elements of another array</title> </head> <center> <body> <p id = "para1"></p> <p id = "para2"></p> <button onClick="fun()"> Click to replace elements</button> <h3 id="demo"></h3> <script> var arr = ["Sharukh","Khan","toh", "suna", "hoga"]; document.getElementById("para1").innerHTML = arr; var anotherArr = [ "Rahul", "naam" ]; document.getElementById("para2").innerHTML = anotherArr; function fun() { Array.prototype.splice.apply(arr, [0, anotherArr.length].concat(anotherArr)); document.getElementById("demo").innerHTML = arr; }; </script> </body> </center> </html>
在上面的輸出中，我們將arr作為第一個引數，其中第二個陣列中的[0, anotherArr.length]（所有元素）將從第一個陣列的起始索引開始替換，而concat() 方法將連線兩個陣列。
示例2
在下面的示例中，我們建立了兩個陣列。第一個陣列的元素比第二個陣列多。透過使用splice()方法，我們將索引設定為0，並傳遞arr2.length，並用展開運算子(…)提取它們，因此元素將從arr1的第0個索引開始替換。
<!DOCTYPE html> <html> <head> <title>Replace elements in array with elements of another array</title> </head> <center> <body> <p id = "para1"></p> <p id = "para2"></p> <button onClick="func()"> Click to replace elements</button> <h3 id="demo"></h3> <script> let arr1 = [6, 31, 8, 21, 20 , 22]; document.getElementById("para1").innerHTML = arr1; let arr2 = ["hello", "numbers"]; document.getElementById("para2").innerHTML = arr2; function func(){ arr1.splice(0, arr2.length, ...arr2); document.getElementById("demo").innerHTML = arr1; }; </script> </body> </center> </html>
正如我們在輸出中看到的，第一個陣列中的元素被替換了。
示例3
在下面的示例中，我們有兩個陣列。第一個陣列中的元素少於第二個陣列中的元素。我們使用splice方法替換了元素。第二個陣列的元素將填充整個第一個陣列，因為第一個陣列中元素的大小小於第二個陣列。
<!DOCTYPE html> <html> <head> <title>OReplace elements in array with elements of another array</title> </head> <center> <body> <p id = "para1"></p> <p id = "para2"></p> <button onClick="func()"> Click to replace elements</button> <h3 id="demo"></h3> <script> let arr1 = [6, 31]; document.getElementById("para1").innerHTML = arr1; let arr2 = [66, 88, 23, 53, 54]; document.getElementById("para2").innerHTML = arr2; function func(){ arr1.splice(0, arr2.length, ...arr2); document.getElementById("demo").innerHTML = arr1; }; </script> </body> </center> </html>
在輸出中，我們可以看到第二個陣列中的元素替換並填充了第一個陣列。
7000+ 次瀏覽
