仓库源文，站点原文

title: JavaScript 闭包详解 layout: post categories: JavaScript tags: js闭包 js作用域

excerpt: JavaScript 闭包原理详解与举例

变量作用域

首先来了解一下Javascript中变量的作用域，除了常见的普通变量外，对象和函数也是一种变量。变量分为局部变量和全局变量。

局部变量

局部变量就是指在函数内部定义的变量，作用域是函数内部网，此变量通常只能在函数内部访问，和外界是区分开的，所以变量名即使和外部的重复，也是两个独立的变量，不会相互影响。局部变量在函数执行是创建，执行完后销毁。

全局变量

全局变量就是函数外部定义的变量，作用域是网页中的所有脚本和函数，它们都能够访问，全局变量是页面加载时创建，页面关闭后销毁。

综合举例：

var a = 0;
function fun1() {
    var a = 1;
    b = 2;
}

这里的 var a = 0; 就是全局变量，var a = 1; 是局部变量，虽然名字重复，但这里是两个独立变量，但是还是不建议出现重复，提高代码可读性；b = 2; 也是全局变量，因为规定函数内部申明的变量，如果不加 var，即会被认为是全局变量，尤其这点需要小心。

闭包

先通俗的总结一下，闭包就是一个可以访问其他函数内部变量的函数，即一个定义在函数内部的函数，也叫内嵌函数。

其次，是闭包的作用，因为通常情况函数内部变量是无法在外部访问的，即全局变量也局部变量的区别，而闭包，就实现了能在外部访问某函数内部变量的功能，让这些变量值始终保存在内存中。

然后，来讲一下如何实现闭包。有以下代码：

function fun1() {
    var a = 1;           //定义一个局部变量
    function fun2() {    //这里的 fun2() 就是闭包
        alert(a);    //fun2() 是 fun1()的子函数，所以能访问之前定义的局部变量，这个是关键
    }
    return fun2;         //然后通过这里，把之前得到的局部变量成功返回到外部去
}
fun1();                      //正常执行函数
var result = fun1();         //将内部变量传递出去，传给变量 result
result();                    //执行这个函数实现对局部变量的访问

当然形式不止这一种，万变不离其宗，最后实现的功能是一样的，例如下面的方法也是可行的：

function fun1() {
    var a = 1;
    return function(){
        alert(a);
    };
}
fun1();
var result = fun1();
result();

注意

也许在很多文章中都能看到这句话“避免滥用闭包”，的确，由于闭包会使一些变量一直保存在内存中，所以如果大量使用的话就会消耗大量内存，影响网页性能。

同时，由于闭包的特性，还会在外部改变函数的内部变量值，有时候这是很危险的，举个例子：

function fun1() {
    var a = 1;
    function fun2() {
        a++;
        console.log(a);
    }

    console.log(a);
    return fun2;
}

var change = fun1();   // 这里 fun1 函数被正常执行，输出 1
change();              // 在外部执行这个函数后，函数内部变量 a 的值就被改变了，输出 2
change();              // 输出 3，以此类推