Common function

What is a function

A function is a piece of JavaScript code that is defined only once, but can be executed or called any number of times.

Methods to define JS functions

1. Function declaration: function keyword

A named function
functoin f () {
    return true
}
Copy the code

Anonymous functions (to combine function expressions)

function () {
    return true
}
Copy the code

2. Function expressions

Function expression + named function
var funcName = function f (a, b){
    return a + b
}

Copy the code
Function expression + anonymous function
var f = function (a, b){
    return a + b
}
Copy the code

3. Constructor Function

var f = new Function('a', 'b', 'return a + b')
Copy the code

Arrow function

var f = (a, b) => { return a + b }
Copy the code
Var f = (a, b) => a + bCopy the code
Var f = a => a + 1 var f = a => a + 1Copy the code

The function name

function f1 () {} f1.name 'f1' var f2 = function () {} f2.name 'f2' var f3 = function f4(){} f3.name 'f4' f4 : Var f6 = () => {} f6. Name 'f6'Copy the code

Method of memorizing function names

The Function constructor new (” annoymous “) is used to define a Function (” annoymous “).

Note also that when a function expression + a named function, the function name to the right of the equal sign is undefined.

The function returns

  • The function must have a return
  • If there is no return, it defaultsreturn undefined

Function increase

Functions declared by function are promoted in scope and can be called before the function is declared.

f(5); function f (a) { return a*a }; / / 25Copy the code

A function call

1. Direct call

Var f = function (a) {return a + 10} f(1) // 11Copy the code

2. Called by the object as an object property

var obj = {

    f: function (a) { return a + 10 }
}

obj.f(1)  // 11
Copy the code

3, call

Call can change the function’s this, and the first function of call is called as this, followed by the actual arguments.

Let f = function(a, b, c) {return a + b + c} f (1,1,1) // 3 f.call (10, 1,1) // 3Copy the code

Look at this

Let f = function (a, b, c) {return this} f (1,1,1) // this is a Window object. Number { 10 }Copy the code

4, apply

Apply can also bind this, which differs from Call in that its second argument takes an array of parameters. In other words, apply passes parameters as arrays.

let f = function (a, b, c) {
    return a + b +c
}

f.apply (this, [1, 2, 3])   // 6
Copy the code

5. Bind will not be called

Bind can also bind this, but it only generates a new function, not calls it. The newly generated function has already passed its arguments and cannot be changed.

Function f1 (a, b, c) {return a + b + c} let f = f1.bind (this, 1, 1) f(2,2,2) //Copy the code

6. Function call

The function calls itself (either anonymously or named).

(function(a){
    return a + 10
})(10) 
 
// 20
Copy the code

The constructor

What is a constructor

A JS constructor is a function that provides a template for generating an object and describes the basic structure of the object. (Simply a function that generates an object.)

A constructor can generate multiple objects, each with the same structure.

Function People(name) {this.name = name} let person1 = new People('Bob') PeopleCopy the code

The difference between a constructor and a normal function

  1. Constructor names begin with a capital letter. Normal functions use a hump
  2. Constructors use this to represent the instance to be generated. Normal functions do not use this
  3. Constructors generally do not return
  4. The constructor is called with new

new

The new command executes a constructor and returns an object instance.

What did New do?

  1. Create a temporary empty object and point this to the temporary object
  2. Point the empty object’s proto to the constructor’s prototype, and point the constructor’s prototype.constructor to the constructor itself.
  3. Execute the code inside the constructor
  4. Return this temporary object
Function F(n){this.name = n} let F = new F('n1').__proto__ === f.prototype // true f.name // 'n1' F ('n2') // f is not a function, Constructor // F f.__proto__. Constructor // F f.totype. constructor // F f.constuctor // FunctionCopy the code

Constructor return

The new constructor automatically returns the created temporary object.

If manual code returns

  • If a value other than Object is returned, the temporary Object to which this points is still returned. (Non-object include String, Number, Boolean, null, undefined, etc.)
  • If you return an Object, it will return this Object.
Function F(n){this.name = n return '1' // non-object} let F = new F('n1') F // {name: 'n1'} returns the temporary Object referred to by thisCopy the code
Function F(n){this.name = n return {x: 'XXX '} let F = new F('n1') F // {x:' XXX '} return new ObjectCopy the code