Function reference types in JavaScript

Introduction

The most interesting thing in JavaScript is the function, which is rooted in the fact that the function is actually an object . Each of these functions is an instance of a function type, and has properties and methods that are identical to instances of other reference types. function as an object, so the function name is actually a pointer to a function object and is not bound to a function.

function is not overloaded

　　As described in the previous section, the function name is actually a pointer to a function object, so it is not difficult to understand that the function in Javacript does not have a function overload. Take a look at the following example

1 functionAddnumber (number) {2     return100 +Number ;3 }4 5 functionAddnumber (number) {6     return200 +Number ;7 }8 9 varresult = Addnumber (300);Tenalert (result);//Output

In this example we define two functions with the same name, and the first function, when defined, refers to the first function object in the variable object of the global scope, and addnumber points to the first function object. When running to the second function, Addnumber points to the second function object. So addnumber now points to the second function object. So the second function is executed when the function that it references is called.

function declarations and function expressions

　　Functions are usually defined using function declaration syntax, although the syntax of function expressions is also possible, but there are some important differences between them. In fact, when the parser loads data into the execution environment, it is the first to read the function expression so that it is available (accessible) before any code. For a function expression, you must wait until the parser executes to the line of code where it resides before actually parsing the execution.

function as a value

　　In JavaScript, the function name itself is a variable, so the function can also be used as a value. The function is not only available as an argument to another parameter, but can also be returned as the result of another function. Let's take a look at the following example

1 //to sort an array element by property name2     functioncreatecomparisonfunction (PropertyName) {3         return function(Obj1, obj2) {4             varVal1 =Obj1[propertyname];5             varVal2 =Obj2[propertyname];6             if(Val1 <val2) {7                 return-1;8             }9             Else if(Val1 >val2) {Ten                 return1; One             } A             Else { -                 return0; -             } the         } -     } -  -     vardata = [{name: "Gxw", age:25}, {name: "zmm", age:20 }]; +     //Sort by Name property -Data.sort (createcomparisonfunction ("name")); +alert (data[0].name);//Output Gxw A     //Sort by age property atData.sort (Createcomparisonfunction ("Age")); -alert (data[0].name);//Output ZMM

In this example we see that we have returned an anonymous function in Createcomparisonfunction, in which we sort the array of objects based on the attributes.

function Internal Properties

　　There are two very special objects inside the function, namely: arguments and this. The arguments object may also have introduced a point in the preceding. It is an array-like object, but it is not an array . it contains all of the arguments passed into the function. The arguments object also has a Callee property, which is a pointer to the function that owns the arguments object. A very classic example is factorial, see example:

1 functionfactorial (number) {2         if(Number <= 1) {3             return1;4         }5         Else {6             //return number * factorial (number-1);7             returnNumber * Arguments.callee (number-1);8         }9     }Ten  OneAlert (factorial (5));

In this example we see that we have defined a factorial function called factorial. The 6th line is generally our usual practice. However, there is a problem, the factorial function and its name tightly coupled, once changed the name of the factorial function, you need to change the name inside the function. The first approach can be replaced by the use of Arguments.callee. Eliminates the problem of tightly coupled functions and names.

Inside the function the This object refers to the environment object that the function is executed in (when the function is called in the global scope of the Web page, the This object refers to the Window object). Take a look at the following example:

1 varcolor = "Windows Color";2     varobj = {color: ' obj color ' };3 4     functionSaycolor () {5Alert This. color);6     }7 8     functionSayColor2 () {9         return function () {Ten             return  This. Color; One         } A     } -  -Saycolor ();//Windows color the  -Obj.saycolor =Saycolor; -Obj.saycolor ();//obj Color -  +Alert (SayColor2 () ());//Windows color -  +Obj.saycolor2 =SayColor2; AAlert (Obj.saycolor2 () ());//Windows color

In this example, we see that the function this is directed at the global scope is the Window object. Look at line 17th of the code. If you call a function on an object, we see this object that is pointing to the current calling function. The point is, what is this point if there is a function inside the function? through the SayColor2 function we know that in the anonymous function this point is the Window object. So why isn't this object that contains scopes (or external scopes)? As we have described earlier, when a function is called, its active object automatically obtains 2 special objects, this and arguments objects. When the intrinsic function is in both variables, only the active object is searched, so it is not possible to get the 2 objects in the outer scope.

function Properties and methods

　　In JavaScript, functions are objects, so functions also have properties and methods. Each function contains two attributes: the length and the prototype property, respectively. The Length property represents the number of arguments that the function expects to accept. For example, when a function is defined, the parameter list defines 3 parameters, then length is 3. Remember: The number of parameters defined can be obtained by the function name. length. The number of arguments actually passed and the value of the parameter can be obtained in arguments.

Of all the attributes in JavaScript definition, the most mysterious is the prototype attribute. For reference types in JavaScript, prototype is the real place where all of their instance methods are saved. Prototype is not enumerable in JavaScript, so the for-in loop cannot find the prototype property.

Each function contains two non-inherited methods, call and apply methods. The purpose of both functions is to invoke the function in a specific scope, which is actually equal to the value of the this object in the body of the function. In fact, passing parameters is not the real point of call and apply, they are powerful in that they can expand the scope in which the function depends. Take a look at the following example:

1 varcolor = "Windows Color";2     varobj = {color: ' obj color ' };3 4     functionSaycolor () {5Alert This. color);6     }7 8Saycolor ();//Windows color9 TenSaycolor.call ( This);//Windows color OneSaycolor.call (window);//Windows color ASaycolor.call (obj);//obj Color

Note the 12th line of the code, specifying the function body by the call function the value of this is the Obj object. This output is the obj color. Using call or apply to extend the scope is that the object does not need to have any coupling with the function. In the previous example, we first bind the Saycolor to the Obj object and then use Obj.saycolor () to invoke the function. By call or apply we can omit unnecessary steps.

　　

Function reference types in JavaScript