JS basic tutorial: learn javascript anonymous functions

JS Basic Tutorial: Learn JavaScript Anonymous Functions

There is no doubt that John Resig is a meticulous and thoughtful person. With his careful study of the anonymous functions we usually use, he can also dig out some new things. Usually, recursion occurs when a function calls itself. We are not unfamiliar with function calls like the following.

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

There is no problem with a single function. What will happen if we use an anonymous function and place it inside an object?

1.var ninja = {
2. yell: function(n){
3. .};
6.alert(yell(4))//The result is: hiyaaaa;

Now we don’t see any problem. If we create a new object and copy the yell method from ninja, the situation will be different. It’s different. Since the anonymous function is inside ninja, this method is still a reference to the yell method of the ninja object. The problem arises if we redefine the ninja object.

01.var ninja = {

02. yell: function(n){
03.
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 to solve this problem? How to make the yell method more reliable? The most common way is to use "this" inside the ninja.yell method to mutate all instances of the ninja object, that is:

1 .var ninja = {

2. Yell: Function (n) {

3. Return n & gt; 0? This.yll (n-) + "a": "hiy";

4.
5.};

Now we test and we will get the results we need. This is of course one way, the other way is to name the anonymous function, which seems contradictory, but it does work well, voila:

01 .var ninja = {

02. Yell: Function Yell (n) {

03. Return n & gt; 0? Yell (n-) + "a": "hiy";
04.
05. 06.alert((ninja.yell(4)) + " Works as we would expect it to!" );
07.var samurai = { yell: ninja.yell };
08.var ninja = {};
09 .alert( (samurai.yell(4))+ " The correctly method calls itself." );

Naming anonymous functions can go a step further. For normal variable declarations, we can also try to do this, such as:

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 we see is: "flase This function is named two things – at once!". In FF, what we see is: "true This function is named two things. – at once!”. The author once pointed out: Anonymous functions can be named, but they are only visible within the function itself. It seems that is not the case. The test results show that for IE, it is not visible, but in FF, the result is as the author expected. At the same time, we tested myNinja, and the results were also different in IE and FF.

1.alert( typeof myNinja);

2.//It is "undefinde" in FF

3.//It is "function" in IE

In this way, naming the anonymous function, in IE, Only visible externally; in FF, only visible inside functions. In fact, we can use arguments.callee to get the results we need, as follows:

1.var ninja = {
2.                                                                                                                                                                                                                                                                   .};
6.alert( ninja.yell(4));

Arguments.callee can be used for every function. It provides us with a reliable method to access the function itself. I think this method is relatively simple and reliable.

To sum up, all these methods will be of great benefit to us in dealing with complex code structures. Choosing to use can make our code structure more concise and clear, which may be the author's original intention.

The above is the basic JS tutorial: learning the content of javascript anonymous functions. For more related articles, please pay attention to the PHP Chinese website (www.php.cn)!