資料結構
網路
關係資料庫管理系統(RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝學
法學如何在JavaScript中將arguments物件轉換為陣列？
本教程將教你如何將JavaScript中的arguments物件轉換為陣列。在開始教程之前，讓我們先了解一下arguments物件。在JavaScript中，每個函式都包含一個'arguments'物件。它包含呼叫或執行函式時傳遞的所有引數的值。
它與陣列非常相似，但它並非真正的陣列。
‘arguments’物件具有一個length屬性，我們可以用它來了解在函式呼叫期間傳遞了多少個引數。
我們可以像訪問陣列索引屬性一樣訪問‘arguments’物件的所有值。例如，arguments[0]給出物件的第一個值，依此類推。
我們可以對arguments物件使用陣列方法，例如slice()、forEach()、map()、filter()等。
因此，要對arguments物件使用所有陣列方法，我們需要將其轉換為JavaScript陣列。
這裡，我們有幾種不同的方法可以將arguments物件轉換為JavaScript陣列。
使用Array.from()方法
我們將在此方法中使用Array.from()方法。它將JavaScript中的可迭代物件或類似陣列的物件轉換為陣列。它建立物件的副本並將它們轉換為陣列。我們可以直接訪問轉換後的陣列，也可以將其儲存到另一個變數中。
語法
使用者可以按照以下語法將arguments物件轉換為陣列。
Array.from( arguments );
引數
arguments − 要轉換為陣列的arguments物件。
返回值 − Array.form()方法從arguments物件返回一個數組。
示例1
下面的示例演示了使用Array.from()方法將arguments物件轉換為陣列。
<html>
<head>
<title> Converting arguments Object to an array. </title>
</head>
<body>
<h2>The Array.from() Method</h2>
<p> The Array.from() method returns an array.</p>
<p> Array created from arguments Object:</p>
<p id="output"></p>
<script >
let outputDiv = document.getElementById("output");
function convertToArray() {
// store the array of arguments object to resultantArray
const resultantArray = Array.from(arguments);
const mapArray = resultantArray.map((arg) => {
return arg
});
outputDiv.innerHTML = mapArray;
}
// call function by passing arguments
convertToArray(10,20,30);
</script>
</body>
</html>在上面的程式碼中，使用者可以看到我們傳遞了10、20和30作為函式的引數。在函式中，我們將arguments物件轉換為陣列，並使用轉換後的陣列和map函式來確保它被正確轉換。
使用剩餘引數
剩餘引數是JavaScript中在ES6中引入的語法。我們可以使用剩餘引數以陣列形式指定未知數量的引數。使用者只需要在最後一個引數使用擴充套件運算子(...)。
在我們的例子中，我們需要在第一個引數使用擴充套件運算子來獲取所有引數的陣列。
語法
使用者可以按照以下語法操作。
function demo( ...args ) {
// function body
}
demo(1,3,5);引數
args − 使用者可以使用任何變數名代替args，但是要訪問陣列中的引數，使用者需要在函式內部使用相同的陣列名。
返回值 − 它將返回一個數組。當我們將剩餘引數傳遞給函式時，它會自動將引數物件轉換為陣列。
示例2
下面的示例演示了使用擴充套件運算子將arguments物件轉換為陣列。
<html>
<head>
<title> Converting arguments Object to an array. </title>
</head>
<body>
<h2>Rest Arguments: Converting arguments Object to an array.</h2>
<p> A fucntion with rest paramters treats the arguments object as an array.</p>
<p> Array created from arguments Object: </p>
<p id="output"></p>
<script>
function convertToArray(...args) {
document.getElementById("output").innerHTML = args;
}
// call function by passing arguments
convertToArray("tutorials", "point", "simply", "easy", "learning");
</script>
</body>
</html>使用者可以看到我們使用擴充套件運算子(...)將arguments物件轉換成了陣列。
透過建立一個新陣列
在此方法中，我們將建立一個新陣列並將arguments物件的 value 賦值給新陣列。正如使用者所知，我們可以透過索引訪問arguments物件的value，這將幫助我們將value新增到新陣列中。
語法
使用者可以按照以下語法操作。
newArray[i] = arguments[i]
演算法
- 步驟1 − 建立一個新的空陣列。
- 步驟2 − 遍歷物件並逐個訪問物件的value，並將它們新增到陣列中。
- 步驟3 − 我們已經將arguments物件轉換為了陣列，使用者可以使用新建立的陣列的所有陣列方法。
示例3
下面的示例演示瞭如何在不使用JavaScript內建方法的情況下將arguments物件轉換為陣列。
<html>
<body>
<h2>Converting arguments Object to an array.</h2>
<p> Newly created array after applying the sort() method: </p>
<p id="result"> </p>
<script>
let resultDiv = document.getElementById("result");
function convertToArray() {
// assign arguments values to the newArray
const newArray = [];
for (var i = 0; i < arguments.length; i++) {
newArray[i] = arguments[i];
}
// sort the newArray
const sortedArray = newArray.sort((a, b) => a - b);
resultDiv.innerHTML = sortedArray;
}
// call function by passing arguments
convertToArray(1, 354, 23, 132, 64, 2, 7, 3, 8, 10);
</script>
</body>
</html>使用者可以看到我們手動將arguments物件轉換為了陣列並對新建立的陣列進行了排序，從而打印出上述輸出。
結論
在本教程中，我們介紹了三種將arguments物件轉換為陣列的方法。前兩種方法使用內建方法將物件轉換為陣列。在第三種方法中，我們手動將arguments物件轉換為陣列。對於使用者來說，最好的方法是使用剩餘引數來執行上述操作。
899 次瀏覽
