JavaScript闭包的重难点剖析_js函数闭包重点难点分析,灵魂拷问

56 阅读4分钟

常用的JavaScript设计模式

  • 单体模式

  • 工厂模式

  • 例模式

函数

  • 函数的定义

  • 局部变量和全局变量

  • 返回值

  • 匿名函数

  • 自运行函数

  • 闭包

开源分享:docs.qq.com/doc/DSmRnRG… console.log(globalName);//global function setName(){ vName = 'setName'; setName(); console.log(vName);//setName console.log(window.vName)//setName


全局变量也会有一些弊病:定义很多全局变量的时候会容易引起变量名的冲突  
 函数作用域:  
 该作用域只能在函数内部才能访问到,当这个函数执行完之后,这个局部变量也相应会被销毁



function getName(){var name = 'inner'; console.log(name);//inner} getName(); console.log(name);


块级作用域:  
 最直接的表现就是新增的let关键词使用let关键词定义的变量只能在块级作用域访问  
 特点:暂时性死区即这个变量在定义之前是不能被使用的  
 例如:在JS编码过程中if语句以及for语句后面的{…}这里面所包含的就是块级作用域  
 代码实例:



console.log(a)//a is not definedif(true){ let a= '123' console.log(a);//123 console.log(a)//a is not defined


红宝书闭包的定义:闭包是指有权访问另外一个函数作用域中的变量的函数  
 MDN:一个函数和对其周围状态的引用捆绑在一起(或者说函数被引用包围),这样的组合就是闭包(closure)  
 也就是说,闭包让你可以在一个内层函数中访问到其外层函数的作用域  
 这是二者给出的关于闭包的官方说明。  
 闭包的基础概念:闭包其实就是一个可以访问其他函数内部变量的函数,通常情况下,函数内部变量是无法在外部访问的,因此闭包的作用就具备了实现能在外部访问某个函数内部变量的功能



function fun1(){ var a= 1; return function(){ console.log(a);}; } fun1(); var result= fun1(); result();// 1


闭包产生的原因:  
 作用域链的基本概念:  
 当访问一个变量时,代码解释器会首先在当前的作用域查找如果没找到,就去父级作用域去查找直到找到该变量或者不存在父级作用域中  
 代码图片如下  
 ![在这里插入图片描述](https://p9-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/ed86aeae0462426682c66c0d819f6891~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg55So5oi3MzM5MTQ5MjgwNjA=:q75.awebp?rk3s=f64ab15b&x-expires=1770715791&x-signature=UDv5jWGP68ArODboWLYWnxD3PAI%3D)  
 所以可以得出闭包产生的本质就是:当前环境存在指向父级作用域的引用  
 代码如下:



function fun1(){vara=2 function fun2(){ console.log(a); /2} return fun2; var result = fun1();result();


有一个误区:大家都认为只有返回函数了才算产生了闭包,其实并不是这样的,我们这需要让父级的作用域引用存在就是闭包  
 ![在这里插入图片描述](https://p9-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/f4e9885d46744a6c8f4d60abac36dd3b~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg55So5oi3MzM5MTQ5MjgwNjA=:q75.awebp?rk3s=f64ab15b&x-expires=1770715791&x-signature=DCQlOeILg6LBZ0jarZFE8WRYxWE%3D)  


### 最后

javascript是前端必要掌握的真正算得上是编程语言的语言,学会灵活运用javascript,将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识,而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的,直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后,发现暂时没有提升的空间,我们可以暂时放一放。继续下面的学习,javascript贯穿我们前端工作中,在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解,关键是灵活运用。

**[开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://docs.qq.com/doc/DSmRnRGxvUkxTREhO)**

![css源码pdf](https://p9-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/5b9ecff7ed7148fd8110ab8bfaed17b0~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg55So5oi3MzM5MTQ5MjgwNjA=:q75.awebp?rk3s=f64ab15b&x-expires=1770715791&x-signature=44gtpbH8SVe%2Ftge3pRwESDvot8g%3D)

![JavaScript知识点](https://p9-xtjj-sign.byteimg.com/tos-cn-i-73owjymdk6/d28ec139f8d74d1db233674a345f7d4c~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAg55So5oi3MzM5MTQ5MjgwNjA=:q75.awebp?rk3s=f64ab15b&x-expires=1770715791&x-signature=jSfdlKwIWMbFixEh4OCTp%2BC1pvs%3D)