理解JavaScript中的闭包和闭包中的this指向

野性酷女 2022-05-31 13:12 255阅读 0赞

#### 一． 什么是闭包？ ####

闭包是指可以访问另一个函数作用域中变量的函数。在js中，只有函数内部的子函数才能够读取局部变量。因此可以简单地将闭包理解为： 定义在某个函数中的函数。

#### 二、闭包原理： ####

上级作用域无法直接访问下级作用域中的变量，但下级作用域可以访问上机作用域中的变量。

例如
    function fn1(){
    	 var n = 100;
    	function fn2(){
    	   console.log(n);  //输出100
    	}
    }
    
    function fn1(){
    	 function fn2(){
    		 var n = 100;
    	}
    	console.log(n);//会报错
    }
    函数fn2就是闭包。

#### 三、闭包的作用 ####

*  让外界读取某个函数内部的变量
 *  让这些变量始终保持在内存中（可能会造成内存泄漏)
 *  最基本的作用：可以通过闭包返回的函数或者方法，来修改函数内部的数据
 *  创建一个私有的空间，保护数据

#### 四、闭包的基本模型 ####

function fn(){
    		var data = “1111”,
    		return function(){
    			return data;
    		}
    }
    var f = fn(); //此时f接收到fn中的匿名函数
    var n = f();  //1111

这段代码的特点: 匿名函数嵌套在fn中， fn返回这个匿名函数。函数fn外的变量f引用了函数fn内的匿名函数。

--------------------

#### 五、关于this指向 ####

*  this对象是在运行时基于函数的执行环境绑定的，谁调用this就是谁。如果在全局范围中，this就是window，如果在对象内部，this就指向这个对象。  
    因为闭包并不属于这个对象的属性或方法。所以在闭包中的this是指向window的

### 六、闭包的小应用 ###

使用闭包筛选出数组中区间\[a,b\]的值

// 闭包demo
    const arr = [1,4,5,6,7,22,12,33,7];
    
    function between(a,b){ 
        return v => v >= a && v <= b;
    }
    const b = arr.filter(between(3, 9));
    
    console.log(b);