一、arguments对象
01、函数里的arguments
对于一个普通函数fn，函数内部内置了一个 arguments 对象，当用于接收实参的形参个数不确定时，可以用arguments接收。
function fn(){
console.log(arguments)
// [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ]
}
fn(1,2,3)
arguments展示形式是一个伪数组。
02、什么是伪数组
伪数组也叫类数组，并不是真正意义上的数组，是一组具有数组的length属性以及下标，但是不具有数组的push、pop、reverse等方法的对象。
- 01. 具有length属性和下标：
function fn(){
console.log(arguments.length) // 3
console.log(arguments[1]) // 2
}
fn(1,2,3)
- 可以遍历
function fn() {
for (var i = 0; i < arguments.length; i++) {
console.log(arguments[i]) // 1 2 3
}
}
fn(1, 2, 3)
- 不具有数组的 push , pop等方法
function fn() {
arguments.push(4)
// Uncaught TypeError: arguments.push is not a function
}
fn(1, 2, 3)
03、箭头函数里的arguments
箭头函数里不能使用arguments获取参数列表。
var fn = (a,b,c) => {
console.log(arguments) // 并不是参数列表
}
fn(1,2,3)
但是可以使用剩余参数获取参数列表。
二、剩余参数
01、简介
剩余参数语法允许我们将一个不定数量的参数表示为一个数组。
function fn(...arguments) {
console.log(arguments) // [1,2,3]
}
fn(1, 2, 3)
02、可以与扩展运算符一起使用
function fn(a, ...arguments) {
console.log(a) // a
console.log(arguments) // [2,3]
}
fn(1, 2, 3)
03、剩余参数是真正的 Array
具有伪数组不具有的pop、push、sort方法等。
function fn(...arguments) {
return arguments.sort()
}
console.log(fn(3, 2, 1)); // [1, 2, 3]
三、伪数组转真正的数组
01、Array.prototype.slice.call()
function fn() {
var args = Array.prototype.slice.call(arguments);
args.push(4)
return args
}
console.log(fn(1,2,3)); // [1,2,3,4]
02、Array.from()
function fn() {
var args = Array.from(arguments);
args.push(4)
return args
}
console.log(fn(1,2,3)); // [1,2,3,4]
03、结构赋值
function fn() {
let arr = [...arguments]
console.log(arr)
}
console.log(fn(1, 2, 3)); // [1, 2, 3]
四、剩余参数和arguments对象之间的区别
1. 剩余参数只包含那些没有对应形参的实参，而 arguments 对象包含了传给函数的所有实参。
2. 剩余参数是真正的数组，arguments对象不是一个真正的数组。
3. arguments对象还有一些附加的属性。
arguments对象的属性：
callee: ƒ fn()
length: 3
Symbol(Symbol.iterator): ƒ values()
arguments: (...)
caller: (...)
length: 0
name: "values"
__proto__: ƒ ()
[[Scopes]]: Scopes[0]
__proto__: Object
END
推荐阅读：
