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

 分类:js知识时间:2018-03-07 21:49:16点击:

   有工作经验的前端都知道,面试时基本都会问下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>


除注明外的文章,均为来源:老汤博客,转载请保留本文地址!
原文地址: