arguments

Arguments is an array-like object used to store function arguments

Arguments and parameters are stored in the AO object of the function object

Arguments only exist in normal functions, not in arrow functions

function foo() {
  console.log(arguments)
  /* {0: 1, 1: 2, 2: 3, 3: 4, 4: 5, length: 5, callee: foo function body} */
}

foo(1.2.3.4.5)
Copy the code

Usage scenarios

function foo() {
  // Get the length
  console.log(arguments.length) / / = > 5
}

foo(1.2.3.4.5)
Copy the code
function foo() {
  // Get parameters based on the index
  console.log(arguments[2]) / / = > 3
}

foo(1.2.3.4.5)
Copy the code
let count = 0

function foo() {
  // implement recursion
  count++
  console.log(count)

  if (count < 10) {
    arguments.callee()
  }

}

foo()
Copy the code

Turn the arguments array

Array-like means that it is not an array type, but an object type

  • But it does have some of the features of arrays, such as length, which can be accessed via index
  • But it does not have some methods of arrays, such as forEach, map, etc

So in practice, we might need to convert an array-like object into a pure array object

Manual traverse
function foo() {
  const arr = []

  for(let i = 0; i < arguments.length; i++) {
    arr.push(arguments[i])
  }

  return arr
}

console.log(foo(1.2.3.4.5))
Copy the code
Call the slice method of the array

Analog Slice implementation

Array.prototype.customSlice = function(start = 0, end) {
  end = end || this.length

  const arr = []

  // Slice itself returns a new array after traversal
  // So slice's call objects can be either pure array objects or array-like objects
  for (let i = start; i < end; i++) {
    arr.push(this[i])
  }

  return arr
}

const arr = [1.2.3.4.5]
console.log(arr.customSlice()) // => [1, 2, 3, 4, 5]
console.log(arr.customSlice(1.3)) / / = > [2, 3]
Copy the code

conversion

function foo() {
  return Array.prototype.slice.call(arguments)}console.log(foo(1.2.3.4.5))
Copy the code
function foo() {
  return [].slice.call(arguments)}console.log(foo(1.2.3.4.5))
Copy the code
ES6 method

Array.from

function foo() {
  // array. from converts Array objects and array-like objects to Array objects
  return Array.from(arguments)}console.log(foo(1.2.3.4.5))
Copy the code

Expansion operator

function foo() {
  return [...arguments]
}

console.log(foo(1.2.3.4.5))
Copy the code

There is no arguments in the arrow function

const foo = () = > console.log(arguments)

// Foo has no arguments inside at this point, so we'll look for arguments in the upper scope according to the scope chain
// Global scope in this case
// 1. No arguments exist in the browser global scope
// 2. In Node, because all modules in Node use IIFE wrapping, compile as a function
So there are arguments objects in node's global scope
foo()
Copy the code
function foo() {
  return () = > console.log(arguments)
}

foo(123) ()// {0: 123}
Copy the code

In ES6, it is recommended to use residual arguments instead of arguments,

That is to separate arguments received with and without parameters, instead of storing all arguments in arguments

const sum = (num1, num2, ... nums) = > console.log(nums)

sum(1.2) / / = > []
sum(1.2.3.4.5) // => [3, 4, 5]
Copy the code