[Effective JavaScript Notes] Chapter 2nd: Variable scope-Personal summary

Source: Internet
Author: User
Tags variable scope

Objective

The second chapter mainly explains the various variables scope, through this chapter's study, has contacted many things which had not been touched before, such as the eval which does not use frequently, the name function expression, with the statement block and so on, below is a list, I to each section a little individual summary, many are own harvest and the understanding. There may be many misunderstandings, after all, the level is limited. If there is a wrong place to know, but also hope to be in the comments to the middle, so that you can get everyone in the study of help, is also very good.

8th: Minimize the use of global objects Personal summary:

Explain the randomness of the global object definition in JS, which causes everyone to define and modify, leading to naming conflicts. Reliance on such global objects leads to unpredictable results, which is extremely detrimental to later maintenance and to the impact of code reuse. Several suggestions are provided, including the scope of the function generated by the JS code to divide the variables. Also, make minimal modifications to the global objects of the hosting environment. To avoid any impact on other reference libraries. When adapting the runtime environment, the global object is tested for properties, and the native objects provided by the environment are used as much as possible. Because the object in the platform environment is correct and consistent, and performance has advantages.

Tips
    • Avoid declaring global variables

    • Declare local variables as much as possible

    • Avoid adding properties to global objects

    • Using global objects to do platform detection

9th: Always declare local variables personal summary:

This section feels like a supplement to the previous section, so what do you use when you try to use less global objects? is to always declare local variables. Mainly in writing code when do not forget, VAR, if not this will automatically become a global. For those of you who are not very confident about your code writing ability, you can use some build tools, add code to detect the plug-in. And then each run to know that there is no corresponding error in the code, it is recommended to use gulp. You can see how to use it in one of the previous articles.

Tips
    • Always declare a new local variable with VAR

    • Consider using the Lint tool to help check for unbound variables

10th: Avoid using with personal summary:

Using with, you can save the name of writing some objects, and you can use less code in your code. I didn't use it before, only to know that it would change the point of this. From the Learning section, it is understood that its use may affect the lookup of the values of the corresponding variables in your code, and that each variable will find the existence in the prototype chain of the with object, resulting in a decrease in performance. During the maintenance of the later code, it is possible to break the function or method that originally used the With reference object, because it is possible to add new properties or methods to the object with later and the names of the variables in them, causing the function not to complete properly, destroying the function's expected function. As an alternative, you can use some short names, such as the Var win=window,doc=document that I often use, and so on, you can use this method to reduce the amount of code when you have a large number of methods or properties for the same object.

Tips
    • Avoid using the WITH statement

    • Use short variable names instead of repeatedly accessed objects

    • Explicitly bind local variables to object properties instead of using the WITH statement to bind them implicitly.

11th: Master Closure Personal Summary:

This is a noun, and it's OK to know when it's going to happen. The main is two, one is the function can produce the scope, two is defined inside the function can access its outer function of the variable object (even if the outside function has been returned). This takes up memory because the variable object of the outer function is kept, and if you want to release the closure, the display is set to NULL to be OK. Closed packets more places, one is defined and called the point of time is not uniform, such as: the definition of the function of the binding event handle, the defined point in time, and the time of the call is uncertain (when the event is triggered), two is at the time of the interview, various, variable value of what is evaluated.

Tips
    • A function can reference a variable defined in its outer scope

    • Closures have a longer life cycle than the functions that create them

    • Closures internally store references to their external variables and can read and write these variables

12th: Understanding Variable Declaration Promotion Personal Summary:

Variable promotion, see more places, but also a variety of face questions. After understanding the variable promotion, you can test the topic first according to the process of JS parsing, some var,function statements are written ahead, and then combined with the scope of access order, the basic can be answered correctly. This is mainly JS no block-level scope, the smallest unit of scope is the function. Variable declaration promotion is just a good way to find the nearest function, and then put all the declarations here.

Tips
    • Variable declarations in code blocks are implicitly promoted to the top of the enclosing function

    • Re-declaring a variable is treated as a single variable

    • Consider manually raising local variable declarations to avoid confusion

13th: Creating a local scope with an immediately called function expression Personal Summary:

As long as you have seen some of the source of the library, should all this is not unfamiliar. (function () {}) (); This is when the creation is done, and of course there are some parameters to pass in. The variable name created in this, as long as the Var, must be local, the function returned here must be closed, you can access the internal variables of this function. You can resolve the issue of reference to external variables for the event bindings mentioned above. As far as the book says, Break,continue cannot be used. And the effect on the this,arguments variable. The effect on the this,arguments variable. This will either point to the new object or point to window. When a function is used as a constructor, and when a new keyword is called, or when a function acts as a method of an object, this points to the object. The function that runs directly this points to the Window object. The run immediately function is executed directly, so this is pointing to window. (Personal understanding may be wrong, please point out). The arguments is the function parameter object, and the function is also the function with the Parameter object. It should be all right to be aware of this.

Tips
    • Understand the difference between binding and assignment

    • Closures copy their external variables by reference rather than by value

    • To create a local scope by using an immediately called function expression

    • Beware of situations in which the parcel block of code may change its behavior in an immediately invoked function expression

14th: Beware of naming function expressions Clumsy scope Personal summary:

Named function expressions, used in some recursive cases, such as writing an animation function, the inside of the iteration function is to use this. But in general I am directly in the give immediately execute function expression a name.
Shaped like

(function a(){     //....   a();})();

Its scope can only be accessed internally, the book said the various circumstances of the analysis of what, have not encountered. Now use the Environment: browser, Nodejs, temporarily did not find any problem. Here just think that the scope of the name function expression As object is very interesting, but in the browser to try, no problem, it may be the implementation of the reason for ES5 it.
Improved stack tracking this is really useless, such as try to see.

Tips
    • Using a named function expression in the Error object and the altimeter to improve stack tracking

    • In ES3 and problematic JS environments, remember that function expression scopes are object.prototype contaminated

    • Keep in mind that a named function expression declaration is promoted in the wrong JS environment and causes duplicate storage of a named function expression

    • Consider avoiding the use of a named function expression or deleting a function name before publishing

    • If you publish the code in a properly implemented ES5 environment, then there is no problem.

15th: Beware of local block function declarations clumsy scope personal summary:

nested function declarations, functions defined in an immediate execution function are nested. Because there is no block-level scope, declaring a function in a block automatically promotes the function declaration to the top of the scope. If you want to declare a function according to the condition, you can assign the variable in the form of a function expression to get the function of the function. For example: function of Event Registration

function addEvent(o,e,f){    var addE;    if(document.addEventListener){        addE=function(o,e,f){            o.addEventListener(e,f,false);        }    }else if(document.attachEvent){       addE=function(o,e,f){            o.attachEvent(‘on‘+e,f);        }     }else{        addE=function(o,e,f){            o[‘on‘+e]=f;        }     }        addE(o,e,f);    addEvent=addE;}
Tips
    • Always place a function declaration at the outermost layer of a program or contained function to avoid non-portable behavior

    • Replacing a conditional function declaration with a VAR declaration and conditional Assignment statement

16th: Avoid using eval to create a local variable personal summary:

Not much to use in the work, only in the processing of JSON data, that is, to convert the string into a JSON object is used in the process. It is also through this article that the effect on the external scope is unpredictable because you do not know whether the string to be processed includes modifications to the variables in the scope, including modifications to the global variables. It is recommended that you use the immediate execution function to isolate the processing code.

Tips
    • Avoid variables created with the Eval function to contaminate the caller's scope

    • If the Eval function code could create a global variable, encapsulate this call in a nested function to prevent scope contamination

17th: An indirect call to the Eval function is better than a direct call to personal summary:

Most functions can only access the scope in which they are defined, but not the scope beyond. The Eval function has the ability to access the entire scope at which it was called, that is, where it is called, and it can access the scope there. The function is very powerful, but can not optimize JS. Because each function that invokes eval is guaranteed to be accessible to the Eval function at run time throughout the scope. You can use (0,eval) (SRC) to become an indirect call to improve performance. Other I don't think I need to know, after all, this would have been used less, at least I used less.

Tips
    • Wrapping the Eval function with a meaningless literal is wrapped in a sequence expression to achieve the purpose of forcing the use of an indirect call to the Eval function

    • Call the Eval function as indirectly as possible instead of calling the Eval function directly

[Effective JavaScript Notes] Chapter 2nd: Variable scope-Personal summary

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.