利用闭包思想来写插件

闭包是javascript中的一个核心技术点(闭包和异步),要理解闭包,要先理解链式作用域以及js的内存回收机制。当代码在一个环境中执行时,就会形成一个链式作用域,作用域会包括当前环境变量对象、外层变量对象、更外层变量对象以及最外层的window全局变量对象。作用域链就是函数在定义的时候创建的,用于寻找使用到的变量的值的一个索引,而他内部的规则是,把函数自身的本地变量放在最前面,把自身的父级函数中的变量放在其次,把再高一级函数中的变量放在更后面,以此类推直至全局对象为止.当函数中需要查询一个变量的值的时候,js解释器会去作用域链去查找,从最前面的本地变量中先找,如果没有找到对应的变量,则到下一级的链上找,一旦找到了变量,则不再继续.如果找到最后也没找到需要的变量,则解释器返回undefined。

下面再来说下js的内存回收机制,一般来说,一个函数开始执行的时候会为相应的变量分配内存空间,在执行完毕后,这些变量就会被认为是无用,就会被回收掉。但是如果这个外部函数嵌套了内部函数,且这个内部函数能够被外部单独调用,然后内部函数还使用了外部函数的变量,如果在外部函数执行完以后再来调用内部函数的时候,就会出现内部函数读取不到外部函数变量的情况。所以js解释权在遇到这种情况的时候,会自动把函数以及它所使用的变量(包括父级变量以及祖先级变量)一起保存起来,这样就构成了一个闭包。这样对应的内存空间都不会被回收,只有到内部函数也不可能被调用的时候才会被回收。

看看下面的代码

var result=[];
function foo(){
    var i= 0;
    for (;i<3;i=i+1){
        result[i]=function(){
            alert(i)
        }
    }
};
foo();
result[0](); // 3
result[1](); // 3
result[2](); // 3

在for循环中创建了三个内部函数,这三个的执行结果都为3,这是因为闭包中所记录的自由变量,只是对这个变量的一个引用,而非变量的值,当这个变量被改变了,闭包里获取到的变量值,也会被改变是让内部函数在循环创建的时候立即执行,并且捕捉当前的索引值,然后记录在自己的一个本地变量里.然后利用返回函数的方法,重写内部函数,让下一次调用的时候,返回本地变量的值,改进后的代码:

是让内部函数在循环创建的时候立即执行,并且捕捉当前的索引值,然后记录在自己的一个本地变量里.然后利用返回函数的方法,重写内部函数,让下一次调用的时候,返回本地变量的值,改进后的代码:

是让内部函数在循环创建的时候立即执行,并且捕捉当前的索引值,然后记录在自己的一个本地变量里.然后利用返回函数的方法,重写内部函数,让下一次调用的时候,返回本地变量的值,改进后的代码:

var result=[];
function foo(){
    var i= 0;
    for (;i<3;i=i+1){
        result[i]=(function(j){
            return function(){
                alert(j);
            };
        })(i);
    }
};
foo();
result[0](); // 0
result[1](); // 1
result[2](); // 2

你可能感兴趣的:(前端,闭包,js)