This article mainly introduces the ambiguity of braces "{}" in Javascript. Friends in need can come here for reference, I hope to help everyone
Braces in JS have four semantic effects. Semantic 1, which organizes compound statements. The most common code is as follows: if (condition) {// ...} else {// ...} for () {//. ..} Semantic 2, the object direct declaration code is as follows: var obj = {name: 'jack', age: 23}; The whole is an assignment statement, where {name: 'jack', age: 23} is an expression. Semantic 3, the code for declaring a function or function is as follows: function f1 () {// ...} var f2 = function () {// ...} The difference between f1 and non-f2 is that the former is in the syntax interpretation period, and the latter In operation. The difference is that if the code that calls the function is after the function definition, there is no difference; if the code that calls the function is before the function definition, f1 can still be called, and f2 will report an error indicating that f2 is undefined. Semantic 4, the syntax symbol code for structured exception handling is as follows: try {// ...} catch (ex) {// ...} finally {// ...} The braces here and the matching statement (semantics 1 ) Is different. If there is only one statement in the braces, the braces can be omitted in if / else / for, but try / catch / finally cannot be omitted. The following code tangles even N long code as follows: function () {} () // Anonymous function is executed immediately, syntax analysis period report {} .constructor // Get constructor of object direct quantity, the syntax analysis period error is puzzling The reason is that [] .constructor is written without error, one is a constructor that wants to get the direct amount of the object, and the other is a constructor that gets the direct amount of the array. Of course, adding a variable to receive will not report an error. Var c = {} .constructor; In the same situation, such as var fn = function () {} (), it will not report an error. In fact, the "statement first" of js is making a fool, that is, {} is understood as a compound statement block (semantics 1) rather than the semantics of the object direct quantity (semantics 2) or the declaration function (semantics 3). function () {} (), curly brackets are understood as compound statements. Naturally, the syntax of the function () declaration before the function () is incomplete, causing an error during the parsing period. {} .constructor, braces are understood as compound statements. The dot operator follows the braces. If there is no reasonable object before the dot operator, an error is also reported. The repair method is well known: add a force operator () (function () {}) (), (function () {}); // force it to be understood as a function (semantics 3), "function ()" means to execute the function , Which is executed immediately after the declaration. ({}). constructor // ({}) forces the braces to be interpreted as object literals (Semantics 2). "Object.xx" means to get the members of the object. Naturally, the dot operator can be executed normally.