arguments和arguments转array的方法和ES6剩余参数

arguments对象

众所周知，js是一门相当灵活的语言。当我们在js中在调用一个函数的时候，我们经常会给这个函数传递一些参数，js把传入到这个函数的全部参数存储在一个叫做arguments的东西里面，arguments对象，可以拿到全部实参， 但是我们要注意在箭头函数中是没有arguments

function foo(num1, num2, num3) {
  1.获取参数的长度
  console.log(arguments.length)
  
  2.根据索引值获取某一个参数
  console.log(arguments[0])
  console.log(arguments[1])
  console.log(arguments[2])
  
   3.callee获取当前arguments所在的函数
  console.log(arguments.callee)
  // arguments.callee()
}

我们再些项目中常遇见一些需求，要把arguments转成array，那我们有多少中转法呢?

arguments转array

1.自己遍历

   var newArr = []
   for (var i = 0; i < arguments.length; i++) {
   newArr.push(arguments[i] * 10)
   }
  console.log(newArr)

2.Array.prototype.slice将arguments转成array 拿到数组的原型Array.prototype，原型上有slice方法，执行slice方法，

var newArr2 = Array.prototype.slice.call(arguments)
  console.log(newArr2)

注：额外补充的知识点: Array中的slice实现

Array.prototype.hyslice = function(start, end) {
  var arr = this
  start = start || 0
  end = end || arr.length
  var newArray = []
  for (var i = start; i < end; i++) {
    newArray.push(arr[i])
  }
  return newArray
}

3.ES6的语法 使用ES6语法进行解构展开到数组里面

  var newArr4 = Array.from(arguments)
  console.log(newArr4)
  var newArr5 = [...arguments]
  console.log(newArr5)

ES6剩余参数

这个新的对象和arguments不一样，它是程序员自定义的一个普通标识符，只是需要在前面加上三个点：...

function sum(...nums) {
  console.log(nums)
}

sum(10)      												 //[10]
sum(10, 20)												//[10,20]
sum(10, 20, 30)											//[10,20,30]
sum(10, 20, 30, 40, 50)									//[10,20,30,40,50]

// 展开运算符 spread
var names = ["abc", "cba", "nba"]
// var newNames = [...names]

function foo(name1, name2, name3) {}
foo(...names)
形参和剩余参数一起使用时
function func(a, b, ...rest) {
  console.log(a, b)
  console.log(rest)
}
func(1, 2)
func(1, 2, 3, 4)

写在最后

伙伴们，如果你觉得我写的文章对你有帮助就给zayyo点一个赞👍或者关注➕都是对我最大的支持。当然你也可以加我微信：IsZhangjianhao，邀你进我的前端学习交流群，一起学习前端，成为更优秀的工程师～