从一个小题目谈谈js函数闭包

先来看一个问题

题目

var str1 = str2 = "web";
(function () {
var str1 = str2 = "前端";
})();
console.log(str2);

当然这里输出的是结果是: 前端

如果现在将console.log(str2)变成consloe.log(str1),那么输出的结果就会变成 web

解答

其实这题并不是很难，第一句 var str1 = str2 = "web"; 其实是定义了两个全局的变量，在利用function的闭包内用 var 重新定义了 str1 而没有重新定义 str2

我们知道在默认情况下 如果不用 var 定义的变量都会变成全局变量，所以此时在function闭包内的str2就是引用了全局变量，所以赋值操作当然也就能赋予全局变量 str2 所以输出 str2 结果是 "前端"

而 str1 用了 var 定义，就是在function闭包内的变量，闭包外自然不可以改变，所以输出的结果是 "web"

脑洞大开

其实每一次看到这种形式的代码

(function(){
})()

都觉得非常的新鲜，觉得这里有很多东西可以专研，所以在这里也总结一下这种形式的闭包。

解释前先看看

首先这种形式的闭包是人为的加上去，并不是说可以有什么神奇的 duangduang 的特效，而是可以避免很多本来是局部变量可以搞定的比较 low 的变量去污染全局的变量

其次在js中，是 没有块作用域 这种说法
首先我们回到C++,如果有一段代码是这样

    int number1=10;
    if(true){
      int number1 = 5;
    }
    cout<

这里的结果还是 10

而在js代码之中

    var str1= "web";
    if(true){
        var str1="前端";
    };
    console.log(str1);

这里的结果就是 前端

因为 if{} 没有块作用域，所以内部的str1直接就重定义了外部全局的str1，所以输出的结果就只是"前端"了，而且这也污染了全局变量（那个等于"web"的str1已经不见了踪影）

而大 js 只有 函数作用域

所以我们要利用函数闭包

利用函数闭包能有效的封装局部的变量，而不污染全局作用域

    str1 = "web";
    (function () {
         var str1 = "前端";

         //str1剩下的功能
    )();
    console.log(str1);

此时输出的还是 web

所以我们利用了一个匿名函数 function(){} 并且让他自己调用自己执行函数内部的操作 并且 str1 也没有污染到外部的全局作用域