In JS most often see the most easily confused grammar (turn) _javascript skills

Source: Internet
Author: User
Tags function definition
There are four semantic functions of the curly braces in JS
semantic 1, organizing compound statements, which is the most common
Copy Code code as follows:

if (condition) {
//...
}else {
//...
}
for () {
//...
}

semantic 2, Object Direct Volume declaration
Copy Code code as follows:

var obj = {
Name: ' Jack ',
Age:23
};

The whole is an assignment statement, where {name: ' Jack ', age:23} is an expression, and there is no syntax error.
Semantic 3, declaring a function or function as a direct amount
Copy Code code as follows:

Function F1 () {
//...
}
var F2 = function () {
//...
}

The difference between F1 and F2 is that the former is in the grammatical interpretation period and the latter is in the operating period. The difference is that if the code that calls the function has no difference after the function is defined, if the code calling the function is still callable before the function definition, F2 will F1 the error, prompting F2 undefined.
Semantic 4, syntactic notation for structured exception handling
Copy Code code as follows:

try {
//...
}catch (ex) {
//...
}finally{
//...
}

Here the braces are different from the conforming statement (Semantic 1), if there is only one statement in the curly brace, the curly braces in if/else/for can be omitted, but try/catch/finally cannot be omitted.
The following code is tangled up in a couple of years
Copy Code code as follows:

function () {} ()//anonymous function executes immediately, parsing period error
{}.constructor//Get constructor for object direct quantity, parsing period error

What is puzzling is why [].constructor writes without an error, one is the constructor to get the object's direct quantity, and one is the constructor that gets the direct quantity of the array.
Of course, adding a variable to receive will not error
var c = {}.constructor;
The same situation as
The var fn = function () {} () does not have an error.
In fact, JS "statement first" in the mischief, that is, {} is understood as a compound statement block (semantic 1) rather than object Direct (semantic 2) or declaration function (semantic 3) semantics.
function () {} (), the curly braces are understood as compound statements, and the syntax of the functions () in front of nature () to declare the grammar incomplete causes an error in the parsing period.
{}.constructor, curly braces are interpreted as compound statements, followed by a dot operator, and the dot operator has no reasonable object. Naturally, it also complains.
Repair is well known: Add a force operator ()
(function () {}) (), (function () {});//force it to be understood as a function (semantic 3), and "function ()" means execute the function, which is executed immediately after the declaration.
({}). constructor//({}) forces the curly braces to be understood as Object Direct (semantic 2), "object. xx" means to get the members of the object, and the dot operator behind it is normal to perform.

extension: jquery plugin writing requires a pre-run chapter
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 there is this thing, a lot of JQ plug-ins need to be used in the absence of the use of the pre-run, but I write the time to rarely encountered will write such plug-ins. But sometimes it's good for you.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.