js一分钟学会闭包

一.js闭包理解

  

闭包的三大特点为:

1、函数嵌套函数

2、内部函数可以访问外部函数的变量

3、参数和变量不会被回收。

 

 
 
好了闭包就学完了,就这么简单。
 
 

 

那么你一定很迷 接下来才是重点

 常见的写法

  1.

  

//第1种写法  
function Circle(r) {  
      this.r = r;  
}  
Circle.PI = 3.14159;  
Circle.prototype.area = function() {  
  return Circle.PI * this.r * this.r;  
}  
  
var c = new Circle(1.0);     
alert(c.area());

  2.

  

//第2种写法  
var Circle = function() {  
   var obj = new Object();  
   obj.PI = 3.14159;  
     
   obj.area = function( r ) {  
       return this.PI * r * r;  
   }  
   return obj;  
}  
  
var c = new Circle();  
alert( c.area( 1.0 ) );

  3.

  

//第3种写法  
var Circle = new Object();  
Circle.PI = 3.14159;  
Circle.Area = function( r ) {  
       return this.PI * r * r;  
}  
  
alert( Circle.Area( 1.0 ) );

  4.

  

//第4种写法  
var Circle={  
   "PI":3.14159,  
 "area":function(r){  
          return this.PI * r * r;  
        }  
};  
alert( Circle.area(1.0) );

  

二.闭包的作用
     1、能够访问局部变量或者方法
    
var fn = function(){
	var a = 10;
	return function(){
		a++;
		console.log(a);
	} 
}
var b = fn();
setInterval(function(){
	b();
	b();
},30)

  


         2、在for循环中可以保留i的值
 
     (重要的面试题)!!!
    
    
    
 var aLi = document.getElementById("list").getElementsByTagName("li");

for(var i=0;i<aLi.length;i++){
	(function(a){
		aLi[a].onclick = function(){
			alert(a)
			this.onclick = null;//只让它点击一次
		}
	})(i)
}

 

三.垃圾回收机制

原理理解:

  当一个函数内部的一些方法或者属性没有在全局进行调用的时候,当前函数运行完毕以后就会被回收,下次在调用当前函数的时候函数内部的方法和属性都会被重置,如果一个函数的一些方法和属性在全局进行调用了,那么当前函数不会被销毁,下次在调用当前函数的时候里面的方法和属性不会进行重置。
 
  简单的说就是不管你在外面哪个城市里面拼搏,只要一通你和你爸一通电话(函数运行),你爸永远都会在在家等你回去,哪怕你穷困潦倒,身无分文。

我想你一定理解了......

四.闭包的好处和坏处

好处

1.匿名自执行函数(比如UI的初始化,那么我们可以使用闭包)

var datamodel = {    
    table : [],    
    tree : {}    
};    
     
(function(dm){    
    for(var i = 0; i < dm.table.rows; i++){    
       var row = dm.table.rows[i];    
       for(var j = 0; j < row.cells; i++){    
           drawCell(i, j);    
       }    
    }    
       
})(datamodel);  

  

  

2.缓存

var CachedSearchBox = (function(){    
    var cache = {},    
       count = [];    
    return {    
       attachSearchBox : function(dsid){    
           if(dsid in cache){//如果结果在缓存中    
              return cache[dsid];//直接返回缓存中的对象    
           }    
           var fsb = new uikit.webctrl.SearchBox(dsid);//新建    
           cache[dsid] = fsb;//更新缓存    
           if(count.length > 100){//保正缓存的大小<=100    
              delete cache[count.shift()];    
           }    
           return fsb;          
       },    
     
       clearSearchBox : function(dsid){    
           if(dsid in cache){    
              cache[dsid].clearSelection();      
           }    
       }    
    };    
})();   

  

3 实现封装

var person = function(){    
    //变量作用域为函数内部,外部无法访问    
    var name = "default";       
       
    return {    
       getName : function(){    
           return name;    
       },    
       setName : function(newName){    
           name = newName;    
       }    
    }    
}();    
     
print(person.name);//直接访问,结果为undefined    
print(person.getName());    
person.setName("abruzzi");    
print(person.getName());    
   
得到结果如下:  
   
undefined  
default  
abruzzi  

  

4.面向对象

function Person(){    
    var name = "default";       
       
    return {    
       getName : function(){    
           return name;    
       },    
       setName : function(newName){    
           name = newName;    
       }    
    }    
};    
     
     
var john = Person();    
print(john.getName());    
john.setName("john");    
print(john.getName());    
     
var jack = Person();    
print(jack.getName());    
jack.setName("jack");    
print(jack.getName());    
   
运行结果如下:  
   
default  
john  
default  
jack  

  参考:https://blog.csdn.net/sunlylorn/article/details/6534610

坏处

  1.内存消耗

    于闭包引用另外一个函数的活动对象,因此这个活动对象无法被销毁,这意味着,闭包比一般的函数需要更多的内存消耗

    2.性能问题

   使用闭包时,会涉及到跨作用域访问,每次访问都会导致性能损失。

  

四.单例模式

    未完待续。。。

原文地址:https://www.cnblogs.com/moonzwt/p/9584216.html