js闭包的介绍

我们的JavaScript分为三部分：
EcmaScript(JS核心),DOM,BOM。、
面试中经常会有面试官问我们什么是闭包？你理解的闭包是什么？优缺点？使用场景？

一：闭包的概念：

闭包就是一个的函数的返回值是另外一个函数，返回的这个函数调用了其父函数的内部变量且在外部被执行，就产生了闭包。
特点：函数嵌套函数，内部的函数可以访问外部函数的变量。
闭包=函数+自由变量。

• 优点： 1. 长期驻扎在内存中
  2. 私有成员的存在
  3. 可以隔离作用域，不造成全局污染

• 缺点：
  由于常驻内存，使用不当可能会造成泄漏

• 如何解决内存泄漏：讲暴露在外面的变量都置为null。
  使用场景：封装组件 for循环和定时器结合使用 for循环和dom事件结合 ，节流防抖函数的使用 导航栏获取下标

二：闭包实现一个计数器：

//功能：递增，递减，获取递增或递减之后的值
var Counter=function() {
    //私有变量
    var num=0;
    //私有函数
    var changeValue=function(n) {

        return num+=n;

    }
   return {
       //增
       increment:function() {
            changeValue(1)
       },
       //减
       decrement:function() {
            changeValue(-1)
       },
       //获取值
       getValue:function() {
           return num;
       }
   }
}

三：定时器的累加：

//要求每隔1秒打印1,2,3,.....10

  //setTimeout是异步执行的，异步队列。
 

  for(var i=1;i<=10;i++) {
     
     (function(j) {
        setTimeout(function() {
            console.log('i=j的值：',j)
        },2000*j)
     })(i)

  }

  console.log('最后打印：',i)

  


   for(let i=1;i<=10;i++) {
    
        setTimeout(function() {
            console.log('i的值：',i)
        },1000*i)
  
  }

四：改变页面的字体大小：

<p class="p1">我可真好看</p>
<button class="btn>改变字体</button>
//先声明一个 设置字体大小的函数 
function setSize(size) {

   return function() {

     p1.style.fontSize=size+'px'

   }

}

var size12=setSize(12);

var size40=setSize(40)

var size50=setSize(50);
var p1=document.queryselector('.p1');
var btn=document.getElementByClassName('btn');
btn=size12
btn=size40;
btn=size50;

五：封装组件：

立即调用函数
(function(win,doc) {

  //私有变量
    //私有方法
  
  return {
  	//暴露出去的方法
  
  }




})(window,document)