Introduction to JavaScript Function types

Introduction to JavaScript Function types

// In JS, the Function type is actually an object; each Function is an instance of the Function type, and has attributes and methods like other reference types;

// Because the function is an object, the function name is actually a pointer to the function object;

I. function declaration method

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

1. function declaration method Function box (num1, num2 ){ Return num1 + num2; }   2. function expressions define functions Var box = function (num1, num2) {// the function can be referenced through the variable box; Return num1 + num2; }; // Note that there is a semicolon at the end of the function, just like when other variables are declared; Var another = box; // use a function name without parentheses to access the function pointer rather than call the function; Console. log (another (10, 10 )); 3. Use Function to construct a Function Var box = new Function ('num1', 'num2', 'Return num1 + num2 '); // The third method is not recommended. This syntax will cause parsing of the code twice (the first time the regular JS Code is parsed, and the second time the string passed into the constructor is parsed), thus affecting the performance; // You can use this syntax to understand the concept of "functions are objects and function names are pointers;

Binary Function

1 2 3 4 5 6 7 8 9 10 11

// The function name in JS is a variable, so the function can also be used as a value; // That is to say, a function can be passed to another function just like a parameter, and a function can be returned as the result of another function; Function box (sumFunction, num) {// no matter what function is passed in by the first parameter, Return sumFunction (num); // It returns the result after the first parameter is executed; } Function sum (num ){ Return num + 10; } // Pass the function to another function; // Remove the parentheses after the function name if the pointer to access the function does not execute the function; Var result = box (sum, 10); // => 20;

Internal properties of the three functions

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

// The function has two special objects: arguments and this;   // 1. arguments: A class array object that contains all parameters in the input function. It is mainly used to save function parameters; // The arguments object also has a property named callee, which is a pointer pointing to a function that owns the arguments object; Function box (num ){ If (num <= 1 ){ Return 1; } Else { Return num * arguments. callee (num-1); // use arguments. callee to execute the box itself; } }   // 2. this: refers to the object in which the function data is operated, or the scope of the function call statement; // When a function is called in the global scope, this object references window; Window. color = "red "; Alert (this. color); // print the global color; => red; Var box = { Color: 'blue ', SayColor: function (){ Alert (this. color); // print the local color; => blue; } };

Four Function Attributes and Methods

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42

// Functions in JS are objects, so functions also have attributes and methods, including length and prototype;   // Length attribute: the number of name parameters to be received by the function; Function box (name, age ){ Alert (name + age ); } Alert (box. length); // 2 s   // Prototype attribute: stores all instance methods, that is, the prototype; // Prototype contains two methods: apply () and call (). Each function contains the two non-inherited methods; // The purpose of both methods is to call a function in a specific scope, which is actually equal to setting the value of this object in the function body; Var color = 'red '; Var box = { Color = 'Blue '; } Function sayColor ({ Alert (this. color ); }); SayColor (); // The scope is in window; SayColor. call (this); // The scope is in the window; SayColor. call (window); // The scope is in window; SayColor. call (box); // The scope is in the box, and the object impersonates; => red; // When the call (box) method is used, the running environment of the sayColor () method has become a box object; // The biggest benefit of using call () or apply () to expand the scope is that the object does not need to have any coupling relationship with the method; // Coupling: it means that expansion and maintenance will have a chain reaction; // That is to say, there will be no redundant Association operations between the box object and the sayColor () method, such as: box. sayColor = sayColor;   Function Animal (){ This. name = "Animal "; This. showName = function (){ Alert (this. name ); } } Function Cat (){ This. name = "Cat "; } Var animal = new Animal (); Var cat = new Cat (); // Use the call or apply method to send the showName () method of the original Animal object to the cat object. // The input result is "Cat" Animal. showName. call (cat ,","); // Animal. showName. apply (cat, []);

Summary
1 // The Function is actually a Function-type instance, so the Function is also an object. This is the most characteristic of JavaScript;
2 // because of the function object, the function also has methods that can be used to enhance its behavior;