JS中的闭包

Posted 2020-09-03

想必JS闭包都再熟悉不过了，老生常谈的问题，但是还是要啰嗦几句

有人想问，什么是闭包？用它来做什么？

那么我告诉你，自己去百度搜??

开个玩笑；闭包就是在函数外边可以读取到函数内部变量，本质上就是将函数内部和函数外部连接起来的一座桥梁。

那么它有哪些用途呢？

其实刚刚已经提到了，就是在函数外部可以读取到函数内部的变量，让变量持久化(变量的值会始终保存在内存中)

闭包的原理和机制

在函数func1内部再定义一个函数func2,将局部变量作为函数func2的返回值,在函数func2的外边（func1的里边）将func2返回，此时执行函数func1()();两次即可得到

其实我个人对于一些文字的描述不太感冒，让我看很多遍可能都看不懂，但是如果给我举例子的话我是极其感兴趣的，那么己所欲，施于人（语言表达不好，硬拽??），我也来讲个案例阐述一下

 

function func1(){
		var num1=20;//局部变量num1
		function func2(){
		  console.log(num1);
                  return   num1;//将num1作为函数func2的函数返回值
	   }
		return func2;将函数func2作为函数func1的返回值，返回的是func2函数
}
    var a=func1()();//func1()得到的是func2这个函数，func1()()得到的就是函数func2的返回值num1或者这样写
   var a=func1();
   console.log(a());
   此时就从func1中拿到了num1

 

　　这段代码貌似没有什么难度，但是却实现了想要的到的效果(从func1函数中取出num1的值)，此时可能有人不明白，想得到num1很简单啊，直接在函数func1里面返回num1不就能得到了吗，好的下面我们来尝试一下

function func1(){
        var num1=20;    
        return num1;
    }
console.log(func1());
此时这段代码结果确实是得到了20(也就是函数内部的num1)

此时感觉脸火辣辣的热??，尴尬极了。后来又仔细又思索几番，觉得不是这么回事，回头看了看闭包的用途，其中有一条是让变量持久化，什么叫持久化？(动手去查)，此时我又要讲个案例了??

function func1(){
        var num1=20;    
        return num1++;
   }
var a=func1;
var b=a();
var c=b();
console.log(a(),b,c);
此时打印的结果都是20

那么问题来了，变量并没有持久化？自加操作没有任何作用，那么有什么办法让这个变量像其它的变量一样，此时闭包又派到用场了，

function func1{
            var num1=20;
            function func2(){
                console.log(num1);
                return num1++;
            }
            return func2;
        }
var a=func1();
var b=a();
var c=b();
console.log(a(),b,c);
此时得到的结果为22，20，21，那么显然实现了变量自增的操作

那么实现变量持久化了(也就是保存在内存中了)，而不是执行完函数丢掉了

其实说了这么多，闭包的用途确实挺大，但是任何事物都有两面性，有利有弊，闭包也不例外

闭包的缺点就是内存消耗很大，就像刚刚说的，它会使变量始终保存咋内存中，所以不能滥用这个闭包，否则后果网页性能肯定..??

如果接触过作用域的话，那么理解闭包应该更容易些(不过我觉得我讲的还算清楚了??)，简单提一下作用域

作用域就是变量与函数的可访问范围，作用域控制着变量与函数的可见性和生命周期

作用域分为两种：全局作用域和局部作用域，顾名思义，全局作用域就是代码中的任何地方都能访问到的对象；局部作用域就是只有自己函数内部才可以访问的对象

好了，再好的记性都不如动手去操练一下，尝试一下以上的代码，基本就差不多了??