资讯专栏INFORMATION COLUMN

分享几个闭包的例子

SQC / 2524人阅读

摘要:例子立即调用表达式会立即执行,不需要调用显示调用只是会调用一个匿名函数局部变量不会随着调用的结束而被回收,而是一直保存在内存中例子不是立即调用的,需要显示调用返回匿名函数的引用,如,这时指向匿名函数调用这个匿名函数,局部变量对于来说一直会常

例子1

立即调用表达式会立即执行,不需要test()调用

显示调用test()只是会调用一个匿名函数

局部变量i不会随着调用的结束而被回收,而是一直保存在内存中

javascriptvar test = (function () {
    console.log("test func");
    var i = 0;
    return function () {
        console.log(i);
        return i++;
    }
})();

console.log("........");
test();     //0
test();     //1
test();     //2

// output
// test func
// ........
// 0
// 1
// 2
例子2

test不是立即调用的,需要显示调用test()返回匿名函数的引用,如:var a = test(),这时a指向匿名函数

a()调用这个匿名函数,局部变量i对于a来说一直会常驻内存中

var b = test(),再次调用test,b会返回一个新的匿名函数的拷贝,并且i对于b也是唯一的

javascriptvar test = function () {
    console.log("test func");
    var i = 0;
    return function () {
        console.log(i);
        return i++;
    }
};

console.log("........");
var a = test();
a();    //0
a();    //1
a();    //2

var b = test()
b();    //0

// output
// ........
// test func
// 0
// 1
// 2
// test func
// 0
例子3

不使用闭包,循环结束后i=3

javascriptvar arr = [1, 2, 3];
var obj = {};

var test = function () {
    for (var i=0; i


在for循环里创建了一个立即调用函数表达式

fn0,fn1,fn2分别指向了匿名函数的引用

fn0(),fn1(),fn2()都访问了i(这个i是位于这个匿名函数的上层作用域链,它会被保存在内存中,对于每一个函数引用来说i是唯一的)

javascriptvar arr = [1, 2, 3];
var obj = {};

var test = function () {
    for (var i=0; i


下面这个例子为了加深理解

javascriptvar arr = [1, 2, 3];
var obj = {};

var test = function () {
    for (var i=0; i

例子4

javascriptvar arr = [1, 2, 3];

// 用来存放函数的数组
var fns = [];

var add = function () {
    for (var i = 0; i < arr.length; i++) {
        (function (i) {
            // 把匿名函数push到fns中
            fns.push(function () {
                // 由于函数引用了上层作用域链的i,当被调用时i值不会被改变
                console.log(arr[i]);
            });
        })(i);
    }
};

// 遍历fns执行数组中的函数
var start = function () {
    for (var i = 0; i < fns.length; i++) {
        // 执行fns中的匿名函数
        fns[i]();
    }
};

add();
start();

// output
// 1
// 2
// 3

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/85792.html

相关文章

  • JavaScript:面试频繁出现几个易错点

    摘要:针对于面向对象编程的。因为面向对象就是针对对象例子中的守候来进行执行某些动作。这就是闭包的用途之一延续变量周期。把变量放在闭包里面和放在全局变量里面,影响是一致的。 1.前言 这段时间,金三银四,很多人面试,很多人分享面试题。在前段时间,我也临时担任面试官,为了大概了解面试者的水平,我也写了一份题目,面试了几个前端开发者。在这段时间里面,我在学,在写设计模式的一些知识,想不到的设计模式...

    VincentFF 评论0 收藏0
  • 一个前端自我修养

    摘要:今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。的确如此,到目前为止,还没有任何一个大学会教前端,倒是有些培训班,会讲网页开发三剑客。   今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。   很多人都有这样的感觉:听了很多技术圈子的分享,有的有深度,有的循循善诱,深入浅出,但是呢,几年下来,到底哪些用上了,哪些对自己真的有帮助了?反而有些模糊。   201...

    sugarmo 评论0 收藏0
  • 一个前端自我修养

    摘要:今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。的确如此,到目前为止,还没有任何一个大学会教前端,倒是有些培训班,会讲网页开发三剑客。   今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。   很多人都有这样的感觉:听了很多技术圈子的分享,有的有深度,有的循循善诱,深入浅出,但是呢,几年下来,到底哪些用上了,哪些对自己真的有帮助了?反而有些模糊。   201...

    LinkedME2016 评论0 收藏0
  • 一个前端自我修养

    摘要:今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。的确如此,到目前为止,还没有任何一个大学会教前端,倒是有些培训班,会讲网页开发三剑客。   今天给大家分享的主题是前端的自我成长,这是一个关于成长的话题。   很多人都有这样的感觉:听了很多技术圈子的分享,有的有深度,有的循循善诱,深入浅出,但是呢,几年下来,到底哪些用上了,哪些对自己真的有帮助了?反而有些模糊。   201...

    Michael_Ding 评论0 收藏0

发表评论

0条评论

SQC

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<