web前端面试题必会的js闭包知识

   有工作经验的前端都知道，面试时基本都会问下js闭包问题，考查下你的js基础水平。作为新手前端刚入门的你，这个前端面试必备知识点，你会吗？不会的话，就赶快看下吧，补补课吧。

1.闭包的概念：

    闭包就是一个函数，两个函数彼此嵌套，内部函数就是闭包形成闭包条件是内部函数需要通过return给返回出来。

看下面的代码，你就懂了：

<script type="text/javascript">
    function f1(){
        function f2(){
            alert("我是js闭包！");
        }
        return f2;
    }
    var f=f1();
    f();  //弹出：我是js闭包！
</script>

2. 闭包特点

闭包有权利调用其上级环境的变量信息。父级环境的信息已经固化为本身AO的成员了。

看下代码，更好理解：

<script type="text/javascript">
    function f1(){
        var bb = "闭包";
        function f2(){
            alert('我是'+bb);
        }
        return f2;
    }
    var f = f1();
    f();  //弹出：我是js闭包
</script>

3. 闭包使用规则

同一个闭包机制可以创建多个闭包函数出来，它们彼此没有联系，都是独立的。

并且每个闭包函数可以保存自己个性化的信息。

看下代码，理解下三个闭包彼此独立、没有联系：

<script type="text/javascript">
    function f1(num){
        function f2(){
            alert('数字:'+num);
        }
        return f2;
    }
    var fa = f1(10);
    var fb = f1(20);
    var fc = f1(30);
    fa();   //数字:10
    fb();   //数字:20
    fc();   //数字:30
</script>

4. 闭包的使用例子，加深理解闭包

<script type="text/javascript">
    //创建数组元素
    var num = new Array();
    for(var i=0; i<4; i++){
        //num[i] = 闭包;//闭包被调用了4次，就会生成4个独立的函数
        //每个函数内部有自己可以访问的个性化(差异)的信息
        num[i] = f1(i);
    }
    function f1(n){
        function f2(){
            alert(n);
        }
        return f2;
    }
    num[2]();  //2
    num[1]();  //1
    num[0]();  //0
    num[3]();  //3
</script>