arguements

Arguements is a class array object

Background languages have a problem with function overloading. The function name is the same, but the parameters passed are different, belong to different functions.

There is no overloading in JavaScript

In JavaScript, functions with the same name pass different arguments, and subsequent functions override the previous ones.

function fun(x, y) {
  console.log(1);
}
function fun(x, y, z) {
  console.log(2);
}
fun(1.2)
/ / 2
Copy the code

When the function executes, the actual arguments passed are stored in an array object of the arguments class

Arguments can get any item by array subscript

function sum(a, b) {
  return a + b + arguments[2];
}
console.log(sum(1.2.3.4.5.6));
// a = 1, b =2, arguments[2] = 3
/ / 6

function sum(a, b) {
  console.log(arguments);
  console.log(arguments.length);
  console.log(arguments[0]);
  console.log(arguments[1]);
  console.log(arguments[2]);
  console.log(arguments[3]);
  console.log(arguments[4]);
  console.log(arguments[5]);
  console.log(arguments[6]);
  console.log(arguments[7]);
  console.log(arguments[8]);
  console.log(arguments[9]);
  // arguments can be assigned via array subscripts
  arguments[8] = 100;
  console.log(arguments[8]);
}
sum(1.2.3.4.5.6.7);
// [Arguments] { '0': 1, '1': 2, '2': 3, '3': 4, '4': 5, '5': 6, '6': 7 }
/ / 7
// 1 2 3 4 5 6 7 undefined undefined undefined
/ / 100

Copy the code

Arguments can be iterated through an array to get all items

function sum() {
  for (var i = 0; i < arguments.length; i++) {
    console.log(arguments[i]);
  }
}
sum(1.2.3.4.5.6.7);
// 1 2 3 4 5 6 7 
Copy the code

Not all array methods apply to Arguments

function sum() {
  for (var i = 0; i < arguments.length; i++) {
    arguments.slice(2.5) // Syntax error Uncaught TypeError
  }
}
sum(1.2.3.4.5.6.7);
// arguments.slice is not a function
Copy the code

The function performs different operations depending on the number of actual arguments we pass. (Simulate overload of functions)

Case 1: When the function passes 2 parameters, find the sum of the 2 parameters; When passing three arguments, the third argument is summed over the larger values of the first two arguments

1 / / method
function sum(a, b, c) {
  if (arguments.length === 2) {
    return a + b;
  } else {
    return(a > b ? a : b) + c; }}console.log(sum(1.2));
/ / 3
console.log(sum(1.2.3));
/ / 5

2 / / method
function sum(a, b, c) {
  switch (arguments.length) {
    case 2:
      return a + b;
      break;
    case 3:
      return (a > b ? a : b) + c;
      break;
    default:
      return 'Parameter error';
      break; }}console.log(sum(1.2));
/ / 3
console.log(sum(1.2.3));
/ / 5
console.log(sum(1.2.3.4));
// Parameter error
Copy the code

Case 2: When passing a parameter, determine the odd and even of the number; If two arguments are passed, check whether the parity of the two arguments is the same

function oddOrEven(a, b) {
  switch (arguments.length) {
    case 1:
      if (a % 2= = =0) {
        return a + It's even.;
      } else {
        return a + 'is odd'.;
      }
      break;
    case 2:
      if ((a + b) % 2= = =0) {
        return a + 'and' + b + 'Parity';
      } else {
        return a + 'and' + b + 'Parity is different';
      }
      break;
    default:
      return 'Parameter error';
      break; }}console.log(oddOrEven(5));
// 5 is odd
console.log(oddOrEven(5.6))
// 5 and 6 have different parity
console.log(oddOrEven(5.7));
// 5 and 7 have the same parity
Copy the code

IIFE

IIFE is short for Immediately Invoked Function Expression, which means invoke the Function Expression Immediately

IIFE means that when a function is defined, it is executed immediately

//
function fun() {
  console.log(1);
}
fun();
/ / 1


//
function fun() {
  console.log(1); } ();// Error
// Uncaught TypeError: Unexpected token )


// Function expressions can be executed immediately (not recommended)
var fun = function haha() {
  console.log(2); } ();/ / 2
Copy the code

() is executed immediately, but not directly after a function defined by function. () is executed after a function name or function expression

Dwarf functions defined by the function keyword into expressions

Dwarfing: Prefix a function with a mathematical operator (often in parentheses)

// (+/-/!)
!function fun() {
  console.log(3); } ();/ / 3

// The full version
(function fun() {
  console.log(4); }) ();/ / 4

// ⑥ short method (anonymous function)
(function () {
  console.log(5); }) ();/ / 5

// Use the following method
(function (a, b) {
  console.log(a+b); }) (3.3);
/ / 6

Copy the code

How to write a function expression that is called immediately?

  1. Declare an anonymous function

    function () {
  console.log("I'm an anonymous function");
}
Copy the code

  2. Put the anonymous function in parentheses

    (function () {
  console.log("I'm an anonymous function");
})
Copy the code

  3. Call this function with curly braces

    (function () {
  console.log("I'm an anonymous function"); }) ();Copy the code

IIFE can close its scope

(function fun(a, b) {
  console.log(a + b); }) (1.2);
/ / 3
fun(1.2)
// Uncaught TypeError: fun is not defined
Copy the code
(function (a) {
  a ++;
  console.log(a); }) (5);
/ / 6

(function (a) {
  a ++;
  console.log(a); }) (8);
/ / 9
Copy the code

Anonymous functions in IIFE can participate directly as values if they return values

function sum(a, b, c) {
  return (function (x, y) {
    return (x > y ? x: y)
  })(a, b) + c;
}
console.log(sum(1.2.3));
/ / 5
Copy the code

Observe closures with arrays

Closures: Remember the internal statements and external environment in which they were defined

The data in the array can be of any type. Now let’s store each item in the array into a function

var arr = [];
for (var i = 0; i < 10; i++) {
  arr[i] = function () {
    return i
  }
}
console.log(arr);
// [ [Function], [Function], [Function], [Function], [Function], [Function], [Function], [Function], [Function], [Function] ]
// When the function is executed, I has changed to 10
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]());
}
// 10 10 10 10 10 10
Copy the code

There are two ways to think of different I for each function

  • Adopt the new variable definition method let in ES6

    // var 改为 let
var arr = [];
for (let i = 0; i < 10; i++) {
  arr[i] = function () {
    returni; }}for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]());
}
// 0 1 2 3 4 5 6 7 8 9
Copy the code

  • Use IIFE to execute functions immediately

    // Use IIFE to execute functions immediately
var arr = [];
for (var i = 0; i < 10; i++) {
  (function (x) {
    arr[x] = function () {
      return x;
    }
  })(i);
}
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]());
}
// 0 1 2 3 4 5 6 7 8 9
Copy the code