JS闭包

JS闭包

闭包:

当内部函数被保存到外部时,将会生成闭包 ,闭包会导致原有的作用域链不会释放,造成内存溢出。

   function test() {
    var arr=[];
    for (var i = 0;i<10;i++){
        arr[i]=function () {
            console.log(i);
            document.write("\n");
        }
    }
    return arr;
  }
    var myArr = test();
    for(var j = 0; j <10;j++){
        myArr[j]();
    }

结果:

10
10
10
10
10
10
10
10
10
10

这里的结果都为10,是因为在编译阶段 当执行

arr[i]=function(){}时,只会将等号左边进行赋值,但是右边的函数定义为一个函数引用,它不知道里面的内容。所以只有当函数执行时,

它才会去找i的值那么此时i=10,但是此时它们10个函数共用一个闭包,所以此时的值是10。

 function test() {
    var arr=[];
    for (var i = 0;i<10;i++){
        (function (i) {
            arr[i]=function () {
                document.write(i);
                document.write("\n");
            }
        }(i))
    }
    return arr;
  }
    var myArr = test();
    for(var j = 0; j <10;j++){
        myArr[j]();
    }
0
1
2
3
4
5
6
7
8
9

这里用立即执行函数将变量i直接保存到function里面,所以就arr相当于10个如下function

function myArr0() {
    document.write(0);
 }
function myArr1() {
    document.write(1);
}
function myArr2() {
    document.write(2);
}
//>>>>>
function myArr9() {
    document.write(9);
}

 闭包的作用:

1.实现公有变量: 

eg:函数累加器 

    function add() {
        var count = 0;
         function work() {
            count++;
            console.log(count);
         }
         return work;
    }
    var conters = add();
    conters();
    conters();

  调用几次,就在原有的基础上加几。

2.可以做缓存(存储结构):

 

function test() {
    var num = 100;
    function a() {
        num++;
        console.log(num);
    }
    function b() {
        num--;
        console.log(num);
    }
    return [a,b];
}
var myArray  = test();
myArray[0]();
myArray[1]();

结果:>>>>101 100

这里存在一个问题,a 和b 是否共用一个test的AO,是的他们共用一个AO。

  function test() {
                var food  = "apple";
                 function a() {
                    food = "banana";
                    console.log(food);
                }
                function b() {
                    console.log(food);
                }
                return [a,b];
           }
           var myArray = test();
           myArray[0]();
           myArray[1]();

 banana

 banana

function eater() {
    var food = "";
    var  obj = {
        eat:function () {
            console.log("I am  eating "+food);
            food= "";
        },
        push:function (myfood) {
            food = myfood;
        }
    }
    return obj;
}
var eater1 = eater();
eater1.push('banana');
eater1.eat();
eater1.push('apple');
eater1.eat();

 I am eating banana

 I am eating apple

这里的 food 就相当于一个隐式的变量

3.以实现封装,属性私有化:

4.模块化开发,防止污染全局变量:

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值