JS闭包|谈谈对闭包的理解?什么是闭包?闭包有哪些应用场景?闭包有什么缺点?如何避免闭包引起的内存泄露?

  • 知识点:闭包

  • 闭包是指有权访问另一个函数作用域变量的函数,比如在函数A中声明了另一个函数B 且函数B引用了函数A中的变量 并将内部函数B作为外部函数A的返回值,那么这个函数B就是我们所说的闭包

  • 闭包的条件:嵌套 内层函数引用外层函数的变量 外部函数返回值为内部函数B

  • 作用:一个是可以直接访问函数内部的私有变量,并且形成私有空间,不受外界干扰(保护),另一个就是让这些变量的值始终保持在内存中(保存)

  • 使用场景:创建私有变量、延长变量的声明周期 比如使用闭包模拟私有变量、方法、实现函数柯里化 、模块化、setTimeout传参、回调、立即执行函数、函数防抖、节流 等

  • 缺点:
    闭包会使得函数中的变量都被长久保存在内存中,增加内存使用量。滥用闭包可能导致内存泄漏。(不再用到的内存,没有及时释放,就叫做内存泄漏)

  • 如何避免闭包

    • 在函数退出之前,将不使用的局部变量全部删除,可以使变量赋值为null
    • 避免变量的循环赋值和引用
    • 利用Jquery释放自身指定的所有事件处理程序。
    window.onload = function(){        
        var el = document.getElementById("id");
        el.onclick = function(){
            alert(el.id);
        }
    }
    解决方法为
    window.onload = function(){        var el = document.getElementById("id");        
    	var id = el.id;                //解除循环引用
        el.onclick = function(){
            alert(id); 
        }
        el = null;          // 将闭包引用的外部函数中活动对象清除
    }

//当指定单击事件处理程序时,就创建了一个在其封闭的环境中包含button变量的闭包。
而且,现在的button也包含一个指向闭包(onclick属性自身)的引用。
这样,就导致了在IE中即使离开当前页面也不会释放这个循环。

$(document).ready(function() {    
var button = document.getElementById('button-1');
    button.onclick = function() {
         console.log('hello');         return false;
    };
});


//用jQuery化解引用循环
$(document).ready(function() {    
var $button = $('#button-1');
    $button.click(function(event) {
        event.preventDefault();
        console.log('hello');
    });
});

参考资料:闭包的使用场景 闭包内存泄漏如何解决

你可能感兴趣的:(前端,javascript,前端,jquery)