The definition method of JS function, and the understanding of function object.

Nonsense article:

Today I saw the prototype chain of JavaScript, various points, all kinds of objects have wood, all kinds of halo, all kinds of confusion have wood. Part-time is a challenge to the limits of a person's brain warp. However, the problem was finally solved by me, wow a click. Write down this thing now, lest it be forgotten again.

Main article:

The definition method of function and the understanding of function object.

In my big JS uphold the principle that everything is the object, whether it is the method or the other is no exception.

We often write a method when using Java, when its keyword is function, and in JS we write the function is also used in this keyword, so often make us wrong to associate the two, so often we will guide the wrong direction.

So, let's start with the definition of function .

One: In fact, it is the same as our most common method.

function fname (test) {alert ("" +test);}

Second: The function object is defined by the constructor of function.

var fname = new Function ("Test", "alert (' +test);"); The first parameter actually represents the parameter to pass in the function, and the second parameter represents the procedure to be performed by the current function. The two parameters are actually all string types. But it can be seen in fact that the current content is very complex.

Three: The variable is defined only with a method defined by the Function keyword.

var fname = function (test) {alert ("" +test);}

The above three methods, although the last is a declaration defines a function, but there is a difference. The first method is actually named fname for the function, and two or three methods are used to actually assign an anonymous function to a variable. When you use the second method to define a function, you actually call the constructor and re-read and create a new function object each time it is parsed, so it is very inefficient to call such a function in the loop body, and the other thing is, When we use it to create a function object, it does not follow a typical scope, but is always executed as a top-level function . This means that when it is called inside a function, he does not use variables defined inside the function. Instead, you can only use global variables.

The 13th method actually defines the direct amount of a function in the city. When we don't define a name for the function's direct volume. The direct amount of a function is called an anonymous function. So how do we invoke an anonymous direct volume, as follows:

1. function call to get return value after execution

Method One, call the function and get the return value. Forcing an operator to make a function call Execute
(function (x, y) {
alert (x+y);
return x+y;
} (3,4));

Method Two, call the function, get the return value. Forces the function to execute and then returns a reference to invoke execution
(function (x, y) {
alert (x+y);
return x+y;
}) (3,4);

2. Ignore the return value after execution

Method Three, call function, ignore return value
void function (x) {
x = x-1;
alert (x);
} (9);

Well, finally look at the wrong way to call

Wrong way to call
function (x, y) {
alert (x+y);
return x+y;
} (3,4);

It's a little far away. In fact, when using the first and third methods, the new function is used to define the object of the functions in the first parsing, and the object is stored and run as an internal object. So in JS, not every object is written, it is actually stored in it a related function object, and when we need to call it.

Let's take a look at the definition and content of the sub-function object in detail.

1. The first is our most commonly used content arguments object. His definition is an array-like object that corresponds to the property passed to the function object. The arguments object is a function internal variable that can be used inside all functions. When we call a function, he stores the data that we transmit in the parameters. The following end of it.

1 function Test () {2     if (Arguments[0]) {3         alert ("Arguments:", +arguments[0]); 4     }     5} 6 Test ("a");//A popup box appears on the current page and displays the Arguments:a

So, as can be seen above, the use of arguments objects and arrays is very similar. Why is it that he is just like an array object, because he has only the length property but does not have the other properties and methods of the array.

Of course there are some of its own properties in the arguments object, as follows

• Callee, the property stores the currently called function object. When we use the anonymous function, if we need to call the method object that stores the current arguments object, we can use the current property. However, the use of this property is blocked in ECM5. The reason for this is that the function named to invoke the implementation of the function is better than this way.
• Caller, this property is defined only if the function is executing. Of course, its return content is the same as the ToString method, which is the inverse of the function's decompile text. But in fact, when used to return to the text after the JS has parsed into a function object after execution, so that this property is actually returned to the function itself. However, this property has been deleted in ECM5.
• The Length property is the value that is obtained when the parameter in the current function is read at initialization time. So the value of the length property of the function is actually the same as the size of the arguments.length value.
• The prototype property, which represents the prototype object for the current function object. It is also possible that several current function objects inherit the properties and methods of the prototype object. See also JS prototype chain learning.

Of course, there are some basic methods to define the function object JS.

• The Apply method trusts that you will not be unfamiliar with the method of replacing the current this pointer, and the ice replaces the current function's parameter values with the data in the incoming object. above example:

  function Test () {    alert ("" + This);} function Testtwo (a) {
      Console.log ("this:" +this);    Console.log ("A:" +a); }testtwo.apply (test, [1]); //The effect of the output is this:function test () {alert ("" +  this); and A:1 

  In effect, apply is to replace the this pointer in the current function with the object in the first argument and replace the parameter with the data in the array parameter, but the function call of the money.

• The Bind method, whose effect is that whatever the current function calls his this pointer represents the same value.

  1 varDisplayargs =function(Val1, Val2, Val3, Val4) {2document.write (Val1 + "" + Val2 + "" + Val3 + "" +val4);3 }4 5 varEmptyobject = {};6 7 varDISPLAYARGS2 = Displayargs.bind (Emptyobject, B, "a");8 9DISPLAYARGS2 ("B", "C");Ten  One //Output:12 a b c

  As can be seen from the above, the bind function is actually a bit like binding the current content and a data relationship. and returns a callable object.

• The call method uses the same effect as the Apply method, except that the second parameter passed later is not strictly required to be an array.

The definition method of JS function, and the understanding of function object.