从一个小题目谈谈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<<number1;

这里的结果仍是 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 也没有污染到外部的全局做用域