Give an example:
<script> ~function () {alert ("Hello, World."); }(); </script>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
Just try to know that this code means to declare a function and execute it immediately, because the variable scope in JavaScript is based on functions, so it avoids variable contamination, but here the bitwise operator "~" At first glance is confusing. If you remove it and then run it will be an error: SyntaxError.
Before we explain why, let's start by clarifying two concepts in javascript: function declarations and function expressions:
Let's take a look at what the function declaration is:
<script> function () {alert ("Hello, World."); }; function foo () {alert ("Hello, World."); }; </script>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
Let's look at what the function expression is:
<script> var foo = function () {alert ("Hello, World."); }; </script>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
Now look back at the question at the beginning of the article, why remove the bit operator "~" After the operation will be an error, because from the perspective of syntax parsing, JavaScript does not allow the function declaration directly after the parentheses, and the function expression does not have this restriction, by adding a function declaration before the "~" operator, You can let the parser think of the following as a function expression, and again, it is possible to precede the function declaration with the "!,+,-" operator.
So why don't we use the following function expression in this way?
<script> var foo = function () {alert ("Hello, World."); }(); </script>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
Although there is no problem from the perspective of syntax parsing, the above code has the disadvantage of introducing a variable that may contaminate the existing operating environment and create potential problems.
The use of bit operator "~" method is somewhat Chine, in fact, the function declaration with parentheses set up easier to read:
<script> (function () {alert ("Hello, World."); })(); </script>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
Understand the principle, no matter what the writing, will not be confused.
