首页 > 编程语言 > 详细

JavaScript Patterns 2.2 - Minimizing Globals

时间:2014-05-20 01:22:54      阅读:485      评论:0      收藏:0      [点我收藏+]

Access a global variable in a browser environment:

bubuko.com,布布扣
myglobal = "hello"; // antipattern

console.log(myglobal); // "hello"

console.log(window.myglobal); // "hello"

console.log(window["myglobal"]); // "hello"

console.log(this.myglobal); // "hello"  
bubuko.com,布布扣
  1. The problem with Globals
    • Naming collisions
      1. Code not written by developers

        ? A third-party JavaScript library

        ? Scripts from an advertising partner

        ? Code from a third-party user tracking and analytics script

        ? Different kinds of widgets, badges, and buttons

      2. Implied globals

        meaning that any variable you don‘t declare becomes a property of the global object.

        Solution - Use var to declare variable inside the function.

        bubuko.com,布布扣
        function sum(x, y) {
        
           var result = x + y;
        
           return result;
        
        }
           
        
        // antipattern, do not use
        
        function foo() {
        
            var a = b = 0; // a is local but b becomes global
        
            // ...
        
        }
           
        
        // The right way
        
        function foo() {
        
           var a, b;
        
           // ...
        
           a = b = 0; // both local
        
        } 
        bubuko.com,布布扣
    • portability

      Code to run in different environments (hosts), it‘s dangerous to use globals because you can accidentally overwrite a host object that doesn‘t exist in your original environment (so you thought the name was safe to use) but which does in some of the others.

  2. Side Effects when Forgetting var

    Difference between implied globals and explicitly defined ones—the difference is in the ability to undefine these variables using the delete operator

    ? Globals created with var(those created in the program outside of any function) cannot be deleted.

    ? Implied globals created without var(regardless if created inside functions) can be deleted.

    bubuko.com,布布扣
    // define three globals
    
    var global_var = 1;
    
    global_novar = 2; // antipattern
    
    (function () {
    
        global_fromfunc = 3; // antipattern
    
    }());
    
    // attempt to delete
    
    delete global_var; // false
    
    delete global_novar; // true
    
    delete global_fromfunc; // true
    
    // test the deletion
    
    typeof global_var; // "number"
    
    typeof global_novar; // "undefined"
    
    typeof global_fromfunc; // "undefined"  
    bubuko.com,布布扣
      
  3. Access to the Global Object

    Access the global object without hard-coding the identifier window, you can do the following from any level of nested function scope:

    var global = (function () {
    
       return this;
    
    }());    
  4. Single var Pattern

    ? Provides a single place to look for all the local variables needed by the function

    ? Prevents logical errors when a variable is used before it‘s defined (see "Hoisting: A Problem with Scattered vars" )

    ? Helps you remember to declare variables and therefore minimize globals

    ? Is less code (to type and to transfer over the wire)

    bubuko.com,布布扣
    function func() {
       var a = 1,
       b = 2,
       sum = a + b,
       myobject = {},
       i,
       j;
       // function body...
    } 
    bubuko.com,布布扣

    Note: all uninitialized and declared variables are initialized with the value undefined

    bubuko.com,布布扣
    function updateElement() {
        var el = document.getElementById("result"),
    
        style = el.style;
    
        // do something with el and style...
    }    
    bubuko.com,布布扣
  5. Hoisting: A problem with Scattered vars

    JavaScript enables you to have multiple var statements anywhere in a function, and they all act as if the variables were declared at the top of the function.  

    bubuko.com,布布扣
    // antipattern
    
    myname = "global"; // global variable
    
    function func() {
    
        // same as -> var myname = undefined;
    
        alert(myname); // "undefined"
    
        var myname = "local";
    
        alert(myname); // "local"
    
    }
    
    func(); 
    bubuko.com,布布扣

JavaScript Patterns 2.2 - Minimizing Globals,布布扣,bubuko.com

JavaScript Patterns 2.2 - Minimizing Globals

原文:http://www.cnblogs.com/haokaibo/p/minimizing-globals.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!