js function expressions executed immediately when defining

1. Preface
Functions need to be defined first and then used. This is basically an iron law for all programming languages.
Generally speaking, we need to call a JavaScript function, and the basic situation is defined first and then called. See an example

Copy the codeThe code is as follows:

 
<!--by oscar999 2013-1-16--> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:///TR/html4/"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Say Hello</title> 
</head> 
<body> 
<script> 
//define function 
function sayHello() 
{ 
alert("hello"); 
} 
//call function 
sayHello(); 
</script> 
</body> 
</html> 

But if you don't need to display the calling function and let the function be executed when it is defined, how can you write it?
2. The process of thinking
Judging from the above examples, you may think:
===》Since when calling, add a pair of braces after the function name, can it be executed if you add a pair of braces after the function definition? Like this:

Copy the codeThe code is as follows:

 
function sayHello() 
{ 
alert("hello"); 
}(); 

Unfortunately, the above writing method will report a syntax error in js.
Because when the parser parser parses the global function or function internal function keyword, the curly braces will be parsed into function declarations instead of function expressions by default.

That is to say, the last pair of braces will be parsed into a function with a missing name by default, and a syntax error message will be thrown because the function declaration requires a name.

===》 You may wonder again, if I pass in the braces, will it be parsed into an expression?

Copy the codeThe code is as follows:

 
function sayHello() 
{ 
alert("hello"); 
}(1); 

Indeed, there is no error. However, the above writing method is equivalent to the following writing method

Copy the codeThe code is as follows:

 
function sayHello() 
{ 
alert("hello"); 
}; 
(1); 

These two sentences have nothing to do with each other, the function still won't be executed
3. Correct writing
For JavaScript, brackets () cannot contain statements, so at this point, when the parser parses the function keyword, it will parse the corresponding code into a function expression instead of a function declaration. Therefore, just wrap the braces all the code (including the function part and a pair of braces after it).

Copy the codeThe code is as follows:

 
(function sayHello() 
{ 
alert("hello"); 
}()); 

There is another way to write it, which is to move out the braces at the end, as

Copy the codeThe code is as follows:

 
(function sayHello() 
{ 
alert("hello"); 
})(); 

Recommended is the first way to use.
But many of the better js libraries currently use the second method.
For example: web graphics drawing: git , draw2d ,...