数据结构
网络
关系型数据库管理系统
操作系统
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 对象上使用 Array 方法，例如 **slicer()、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 对象的值分配给新数组。如用户所知，我们可以通过索引访问 arguments 对象的值，这将帮助我们将值添加到新数组中。
语法
用户可以按照以下语法。
newArray[i] = arguments[i]
算法
- **步骤 1** - 创建一个新的空数组。
- **步骤 2** - 遍历对象并逐个访问对象的值，并将它们添加到数组中。
- **步骤 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 对象转换为数组。最佳方法是用户可以使用 **剩余参数** 来执行上述操作。
898 次查看
