深入理解JavaScript中arguments对象的特性与数组转换

arguments对象的基本面貌

一、arguments的面貌

在JavaScript函数的内部，存在一个名为arguments的隐藏变量，它用于存储传递给该函数的所有参数。

接下来通过具体实例观察arguments的输出格式。

(function fn(){
 console.log(arguments)
})(1,2,3,4)

控制台打印结果显示其外观类似数组，这容易让人误以为arguments就是一个数组对象，进而尝试使用数组特有的方法。请看下一个示例。

(function fn(){
 arguments.push(5)
 console.log(arguments)
})(1,2,3,4)

执行结果报错。在实际项目中，这是一个常见的误区。

既然看起来像数组，为什么不能使用push方法？同理，pop、slice等数组方法也无法使用。尽管可以通过下标访问arguments中的参数，但从本质上看，它并不具备数组的全部特性。

我们可以使用instanceof操作符来验证arguments是否属于Array类型。

(function fn(){
 console.log(arguments instanceof Array)
})()

结果显示，arguments确实不是数组的实例，这提示我们它本质上是一个对象。

虽然可以使用for循环遍历arguments中的参数，但将其转换为真正的数组往往是更优的选择。

arguments转换为数组的方法

二、转化为数组

将arguments转换为数组的方法有多种，例如通过对象冒充调用Array.prototype的方法、遍历后push到空数组，或传递给其他函数等。以下简要介绍几种转换方式，遍历push的方法此处不再赘述。

第一种方法：

(function fn(){
 var arr = Array.prototype.slice.call(arguments)
 arr.push(5)
 console.log(arr)
})(1,2,3,4)

这种转换方式性能较低，在性能敏感的场景下不推荐使用。

第二种方法：

function fn() {
 fnArr.apply(null, arguments);
}
function fnArr(a,b,c,d) {
 ···
}

个人更推荐这种做法。

总结

以上就是本文的全部内容。虽然篇幅不长，但希望读者在项目开发中能避免误踩arguments的坑，本文旨在提供实用的参考。