先来看看下面的截图(截图来自廖雪峰大神官网的JavaScript教程)

   

 

  正如上面所说,过量使用全局变量最大的坏处是污染全局,可能在未来造成不可预知的BUG,并且难以维护和扩展。

 

   

 

  正所谓实践出真知,亲手去实践,才能加深理解。为了证实上面所说,我写了一个简单测试demo

  html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        
    
    <script src="js/a.js"></script>
    <script src="js/b.js"></script>
    <script>
        doAdd1();
        doAdd2();
    </script>
    </body>
</html>

 

  a.js

var x = 1,y = 2;

function doAdd1() {
    console.log(x + y);
}

 

  b.js

var x = 2,y = 2;

function doAdd1() {
    console.log(x + y);
}

 

  按理说,执行上面方法以后,结果应该分别是:3 和 4,但结果却都是4,如下图

  

  结果证明了上述所说,全局变量会污染全局,那应该怎么避免呢?

   按照上面的例子,最简单粗暴的方法是把变量定义在function里面,这样就变成了某个方法的局部变量,如下

function doAdd1() {
    var x = 1,y = 2;
    console.log(x + y);
}

 

  另外,还可以用立即执行函数包装一下,所有“全局”变量就变成了匿名函数内部的局部变量

(function(){
    var x = 1,y = 2;
    console.log(x + y);
})()

 

有需要的朋友可以领取支付宝到店红包,能省一点是一点