zoukankan      html  css  js  c++  java
  • 【JS笔记】闭包

      首先看执行环境和作用域的概念。执行环境定义了变量或函数有权访问的其他数据,决定它们的行为,每个执行环境都有一个与其关联的变量对象,保存执行环境中定义的变量。当代码在一个环境中执行时,会创建变量对象的一个作用域链。作用域链保证对执行环境有权访问的所有变量和函数的有序访问。作用域链的最前是当前执行的代码所在环境的变量对象,下一个是外部环境的变量对象,再下一个就是下一个外部环境,一直延续到全局环境。标识符的解析沿着作用域链一级一级查找,直到找到标识符为止。

      而闭包就是是只有权访问另一个函数作用域中的变量的函数。创建方法是在函数内部创建另一个函数。

      当某个函数被调用时,会创建一个执行环境及相应的作用域链,排在作用域链前端的就是当前函数创建的活动对象,第二为是外部函数的活动对象,直到全局环境。每个执行环境都有一个变量对象,全局环境的变量对象始终存在,局部环境的变量对象只在函数执行过程中存在。一般在函数执行完后,局部活动对象就会被销毁,内存中只保留全局环境的变量对象。但当在一个函数内部定义另一个函数时,内部函数会将外部函数的活动对象添加到它的作用域链中。高级程序设计中的例子:

    function createFunction(proertyName){
        return function(obj1,obj2){
            var value1=obj1[propertyName];
            var value2=obj2[propertyName];
            if(value1<value2){
            return -1;
            }else if(value1>value2){
            return 1;
            }else{
            return 0;
            }
        };
    }

    匿名函数被返回后,他的作用域链包含了createFunction的活动对象,createFunction执行完毕后,其活动对象不会被销毁,仍然保存在内存当中。

    坏的影响:

      仍然是高级程序设计里的例子

        var creatFunction=function () {
            var result =[];
            for (var i = 0; i < 10; i++) {
                result[i]=function () {
                    return i;
                };
            }
            return result;
        }
        var a = creatFunction();
        for (var i = 0; i < a.length; i++) {
            console.log( a[i]()); //10 10 10......
        };

      解决方法是进行传参:

        var creatFunction=function () {
            var result =[];
            for (var i = 0; i < 10; i++) {
                result[i]=function (num) {
                    return function(){
                        return num;
                        };
                }(i);
            }
            return result;
        }
        var a = creatFunction();
        for (var i = 0; i < a.length; i++) {
            var b = a[i];
            console.log(b())
        };

       可以利用闭包创建特权方法,访问函数的私有变量。

    function Foo(){
        var n=10;
        this.returnN=function(){
            return n;
        };
    };
    var newfoo=new Foo();
    console.log(newfoo.returnN())//10    
  • 相关阅读:
    get和post的区别
    关于webWorker的理解和简单例子
    JavaScript停止事件冒泡和取消事件默认行为
    深入理解js构造函数
    js之yeild
    文件组织方式
    HTML5新增的标签和属性归纳
    css3新增属性
    CSS3 transition介绍
    Mysql安装
  • 原文地址:https://www.cnblogs.com/rizzle/p/4527551.html
Copyright © 2011-2022 走看看