请解释 arguments 对象的作用。如何将 arguments 对象转换为真正的数组？-JavaScript中文网-JavaScript教程资源分享门户

推荐答案

arguments 对象是函数内部可用的一个类数组对象，它包含了函数被调用时传入的所有实参。它不是一个真正的数组，没有数组的方法，例如 push、pop、slice 等。

将 arguments 对象转换为真正的数组有几种方法：

使用 Array.from()：

function foo() {
  const argsArray = Array.from(arguments);
  console.log(argsArray);
}
foo(1, 2, 3); // 输出 [1, 2, 3]

使用扩展运算符 ...：

function foo() {
  const argsArray = [...arguments];
  console.log(argsArray);
}
foo(1, 2, 3); // 输出 [1, 2, 3]

使用 Array.prototype.slice.call() 或 Array.prototype.slice.apply()：

function foo() {
  const argsArray = Array.prototype.slice.call(arguments);
  // 或者
  // const argsArray = Array.prototype.slice.apply(arguments);
  console.log(argsArray);
}
foo(1, 2, 3); // 输出 [1, 2, 3]

本题详细解读

`arguments` 对象

arguments 对象是一个在非箭头函数内部可用的类数组对象。它包含了函数被调用时传递的所有参数，即使函数定义时没有声明这些参数。可以通过索引访问它的元素，就像访问数组一样，例如 arguments[0] 表示第一个参数，arguments[1] 表示第二个参数。它还具有 length 属性，表示传入参数的个数。

但是，arguments 对象并不是一个真正的数组，因此不能直接调用数组的方法。它本质上是一个类似数组的对象，拥有数组的一些特性，但缺乏数组的全部功能。

转换为数组的原因

由于 arguments 对象不是真正的数组，如果我们想使用数组的方法（例如 map、filter、reduce），我们需要将其转换为真正的数组。此外，在现代 JavaScript 中，更推荐使用剩余参数（rest parameters）...args 来代替 arguments 对象，因为剩余参数会直接返回一个数组。

转换方法详解

Array.from()： Array.from() 是 ES6 中引入的方法，它可以将类数组对象或可迭代对象转换为真正的数组。这是最简洁和推荐的方法。
扩展运算符 ...： 扩展运算符可以将可迭代对象（包括类数组对象）展开成多个独立的元素。使用 [...arguments] 可以创建一个包含所有参数的新数组。这个方法也很简洁并且很常用。
Array.prototype.slice.call() 或 Array.prototype.slice.apply()： Array.prototype.slice 是数组的一个方法，可以返回数组的一个片段（切片）。 call 和 apply 可以改变 this 的指向。这里，我们将 arguments 对象作为 slice 方法的 this 上下文，slice 方法会返回 arguments 对象的一个切片，因为我们没有传递参数，实际上就是返回了 arguments 对象所有元素组成的新数组，从而实现了数组转换。这种方法较为传统，但仍然有效。

选择哪种方法

在现代 JavaScript 开发中，推荐使用 Array.from() 或扩展运算符 ... 来转换 arguments 对象为数组。它们更简洁易懂，且是 ES6 标准。如果需要考虑兼容老旧的浏览器环境， Array.prototype.slice.call() 或者 Array.prototype.slice.apply() 仍然是一种可行的方案。