JS编程建议——62:在循环体和异步回调中慎重使用闭包

简介: 62:在循环体和异步回调中慎重使用闭包

建议62:在循环体和异步回调中慎重使用闭包
闭包在开发中具有重要的应用价值,由于闭包具有持久性,生成的闭包不会立即被销毁,因此它会持续占用系统资源。如果大量使用闭包,将会造成系统资源紧张,甚至导致内存溢出等错误。另外,闭包在回调函数中会带来负面影响,因此在使用时应该慎重。
下面的示例利用闭包来存储变量所有变化的值。
function f( x ){

var a = [];
for ( var i = 0; i < x.length; i ++ ){
    var temp = x[i];
    a.push( function(){
        alert( temp + ' ' + x[i] )
    });
}
return a;

}
function e(){

var a = f( ["a", "b", "c"] );
for ( var i = 0; i < a.length; i ++ ){
    a[i]();
}

}
e(); // 调用函数e
在这个示例中,函数f的功能是:把数组类型的参数中每个元素的值分别封装在闭包结构中,然后把闭包存储在一个数组中,并返回这个数组。但是,在函数e中调用函数f,并向其传递一个数组(["a", "b", "c"]),然后遍历函数f返回数组,此时会发现,数组中每个元素的值都是“c undefined”。
原来闭包中的变量temp并不是固定的,它会随时根据函数运行环境中的变量temp的值变化而更新,这样会导致临时数组元素的值都是字符“c”,而不是“a”、“b”、“c”,同时,由于循环变量i递增之后,最后的值是3, x[3]超出了数组的长度,所以结果就是undefined。
解决闭包存在缺陷问题的方法是:为闭包再包裹一层函数,然后运行该函数,并把外界动态值传递给它,这个函数接收这些值后传递给内部的闭包函数,从而阻断了闭包与最外层函数的实时联系。
function f( x ){

var a = [];
for ( var i = 0; i < x.length; i ++ ){
    var temp = x[i];
    a.push(
        ( function( temp, i ){
            return function(){
                alert( temp + ' ' + x[i] )
            }
        })( temp, i )
    );
}
return a;

}
function e(){

var a = f( ["a", "b", "c"] );
for ( var i = 0; i < a.length; i ++ ){
    a[i]();
}

}
e();
同一个闭包通过分别引用能够在当前环境中生成多个闭包。例如:
function f( x ){

var temp = x;
return function( x ){
    temp += x;
    alert( temp );
}

}
var a = f( 50 )
var b = f( 100 )
a( 5 ) //55
b( 10 ) //110

相关文章
|
22天前
|
JavaScript
闭包(js的问题)
闭包(js的问题)
12 0
|
1月前
|
设计模式 JavaScript 前端开发
js开发:请解释闭包(closure)是什么,以及它的用途。
闭包是JavaScript中的关键特性,允许函数访问并操作外部作用域的变量,常用于实现私有变量、模块化和高阶函数。私有变量示例展示了如何创建无法外部访问的计数器;模块化示例演示了封装私有变量和函数,防止全局污染;高阶函数示例则说明了如何使用闭包创建能接收或返回函数的函数。
15 2
|
1月前
|
前端开发 JavaScript 开发者
探索JavaScript ES6的八种常见使用技巧:开启现代编程之旅
探索JavaScript ES6的八种常见使用技巧:开启现代编程之旅
|
1月前
|
前端开发 JavaScript
如何处理 JavaScript 中的异步操作和 Promise?
如何处理 JavaScript 中的异步操作和 Promise?
15 1
|
1月前
|
存储 缓存 JavaScript
|
1月前
|
前端开发 JavaScript 数据处理
在JavaScript中,什么是异步函数执行的例子
在JavaScript中,什么是异步函数执行的例子
10 0
|
1天前
|
测试技术
js_防抖与节流(闭包的使用)
js_防抖与节流(闭包的使用)
7 0
|
14天前
|
Web App开发 缓存 JavaScript
|
24天前
|
JavaScript 前端开发
JS 单线程还是多线程,如何显示异步操作
JS 单线程还是多线程,如何显示异步操作
22 2
|
29天前
|
JavaScript 前端开发 Java
深入剖析 JavaScript 闭包
深入探讨JavaScript闭包,了解其定义、特性、优缺点及作用。闭包是函数与其引用环境的组合,允许内层函数访问外层作用域,常驻内存可能导致内存泄露。优点包括创建私有变量,缺点则涉及内存使用。闭包在变量搜索中遵循从内到外的规则,并影响变量的作用域和生存周期。理解闭包有助于优化代码并避免性能问题。
21 1