Basic JS Tutorial: Learning javascript anonymous Functions

Basic JS Tutorial: Learn javascript anonymous functions basic JS Tutorial: Learn javascript anonymous functions

There is no doubt that John Resig is a meticulous and thoughtful person who can explore new things in his detail about the anonymous functions we usually use. In general, when a function calls itself, recursion occurs. We are no stranger to the following function calls.

1. function yell (n ){
2. return n> 0? Yell (n-1) + "a": "hiy ";
3 .}
4. alert (yell (4) // The result is hiyaaaa;

A single function does not have any problems. If we use an anonymous function and place it inside an object, what will happen?

1. var ninja = {
2. yell: function (n ){
3. return n> 0? Ninja. yell (n-1) + "a": "hiy ";
4 .}
5 .};
6. alert (yell (4) // The result is hiyaaaa;

Now we can't see any problem. If we create a new object and copy the yell method from ninja, the situation will be different. Since the anonymous function is inside ninja, this method still references the yell method of the ninja object. If we redefine the ninja object, the problem arises.

01. var ninja = {
02. yell: function (n ){
03. return n> 0? Ninja. yell (n-1) + "a": "hiy ";
04 .}
05 .};
06. var samurai = {yell: ninja. yell };
07. var ninja = {};
08. try {
09. alert (samurai. yell (4 );
10.} catch (e ){
11. alert ("Uh, this isn' t good! Where 'd ninja. yell go? ");
12 .}
13. // The result is: "Uh, this isn' t good! Where 'd ninja. yell go? "

How can this problem be solved? How to make the yell method more reliable? The most common method is to use "this" inside the ninja. yell method to change all instances of the ninja object, namely:

1. var ninja = {
2. yell: function (n ){
3. return n> 0? This. yell (n-1) + "a": "hiy ";
4 .}
5 .};

Now we test and we will get the results we need. This is of course a method. The other method is to name an anonymous function. This seems contradictory, but it does work well. Look:

01. var ninja = {
02. yell: function yell (n ){
03. return n> 0? Yell (n-1) + "a": "hiy ";
04 .}
05 .};
06. alert (ninja. yell (4) + "Works as we wowould keep CT it! ");
07. var samurai = {yell: ninja. yell };
08. var ninja = {};
09. alert (samurai. yell (4) + "The method correctly CILS itself .");

The name of an anonymous function can be further divided into two layers. For normal variable Declaration, we can also try to do this, such:

1. var ninja = function myNinja (){
2. alert (ninja = myNinja) + "This function is named two things-at once! ");
3 .};
4. ninja ();

Run the above function. In IE, what I see is: "flase This function is named two things-at once !", In FF, we can see: "true This function is named two things-at once !". The author once pointed out that anonymous functions can be named, but they are only visible within the function itself. It seems that this is not the case. The test results show that for IE, it is not visible, but in FF, the results are as expected by the author. At the same time, we tested myNinja and the results were different in IE and FF.

1. alert (typeof myNinja );
2. // In FF, it is "undefinde"
3. // set function in IE"

In this case, the name of the anonymous function is only externally visible in IE; In FF, it is only visible inside the function. In fact, we can use arguments. callee to obtain the results we need, as shown below:

1. var ninja = {
2. yell: function (n ){
3. return n> 0? Arguments. callee (n-1) + "a": "hiy ";
4 .}
5 .};
6. alert (ninja. yell (4 ));

Arguments. callee is applicable to every function. It provides us with a reliable method to access the function itself. I think this method is simple and reliable.

To sum up, all these methods will be of great benefit for us to handle complicated code structures. Using these methods can make our code structure more concise and clear, which may be the author's original intention.

The above is the basic JS Tutorial: learn about javascript anonymous functions. For more articles, refer to the PHP Chinese website (www.php1.cn )!