The most common syntax in JS is the most confusing syntax)

Javascript braces have four meanings.
Semantic 1: Organizes compound statements, which is the most common
Copy codeThe Code is as follows: if (condition ){
//...
} Else {
//...
}
For (){
//...
}

Semantics 2: Object Direct Volume Declaration
Copy codeThe Code is as follows: var obj = {
Name: 'jack ',
Age: 23
};

It is a value assignment statement. The {name: 'jack' and age: 23} expressions are independent of syntax errors.
Semantics 3: declaring the direct quantity of a function or function
Copy codeThe Code is as follows: function f1 (){
//...
}
Var f2 = function (){
//...
}

The difference between f1 and f2 is that the former is in the syntax interpretation period and the latter is in the runtime period. The difference is: if the code that calls this function is defined after the function, there is no difference. If the code that calls this function can still be called by f1 before the function is defined, f2 will report an error, the prompt f2 is undefined.
Syntax 4: syntax symbols for structured exception handling
Copy codeThe Code is as follows: try {
//...
} Catch (ex ){
//...
} Finally {
//...
}

The braces here are different from the conforming Statement (semantic 1). if there is only one statement in the braces, the braces such as if/else/for can be omitted, however, try/catch/finally cannot be omitted.
The following code is even N long
Copy codeThe Code is as follows: function () {} () // The anonymous function is executed immediately. An error is reported during the syntax analysis period.
{}. Constructor // The constructor that gets the direct object quantity. An error is reported during the syntax analysis period.

What is puzzling is why []. constructor does not report an error when writing this code. One is a constructor that wants to get the direct amount of objects, and the other is a constructor that gets the direct amount of arrays.
Of course, no error will be reported if a variable is added for receiving.
Var c = {}. constructor;
The same situation is shown in figure
Var fn = function () {} (), and no error is reported.
In fact, js statements take precedence. That is, {} is interpreted as a composite statement block (semantic 1) rather than a direct object volume (semantic 2) or a declared function (semantic 3).
Function () {} (), braces are understood as compound statements. The syntax of the previously declared function () is incomplete, which leads to errors in the syntax analysis period.
{}. Constructor. Braces are considered as compound statements. Braces are followed by dot operators. If there are no reasonable objects before the dot operators, an error is also reported.
Solution: Add a forced operator ()
(Function () {}) (), (function () {}); // force it to be understood as a function (semantic 3), and "function ()" indicates executing the function, the statement is executed immediately.
({}). Constructor // ({}) forces braces to be understood as the object's direct quantity (meaning 2), "object. xx indicates that the object member is obtained. Naturally, the vertex operator following the object can be executed normally.

Extension: The JQUERY plug-in must be written in advance.
If you pay attention to some JQ plug-ins, you will often find the following code:
(Function ($) {$ (function () {/* code */})} ($ ))
If you read the above article, you will find out why this is happening. Many JQ plug-ins need to run in advance when they are not used, however, this plug-in is rarely written when I write it. however, it is also beneficial in many cases ~~