Web前端最新JS常见面试题之详解js闭包，2024年最新快手前端面试

2401_84447417

于 2024-05-17 09:15:06 发布

阅读量363

点赞数 4

分类专栏：程序员文章标签：前端面试学习

本文链接：https://blog.csdn.net/2401_84447417/article/details/138992507

版权

程序员专栏收录该内容

154 篇文章 0 订阅

订阅专栏

专业技能

一般来说，面试官会根据你的简历内容去提问，但是技术基础还有需要自己去准备分类，形成自己的知识体系的。简单列一下我自己遇到的一些题

HTML+CSS
JavaScript
前端框架
前端性能优化
前端监控
模块化+项目构建
代码管理
信息安全
网络协议
浏览器
算法与数据结构
团队管理
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

最近得空把之前遇到的面试题做了一个整理，包括我本人自己去面试遇到的，还有其他人员去面试遇到的，还有网上刷到的，我都统一的整理了一下，希望对大家有用。

其中包含HTML、CSS、JavaScript、服务端与网络、Vue、浏览器等等

由于文章篇幅有限，仅展示部分内容

想要真正理解闭包，需要理解执行环境和活动对象

执行环境和活动对象：

执行环境(execution context)定义了变量或者函数有权访问的其他数据，每个执行环境都有一个与之关联的变量对象(variable object)，执行环境中定义的变量和函数就保存在这个变量对象中；

全局执行环境是最外围的一个执行环境，通常被认为是window对象

执行环境和变量对象在运行函数时生成

执行环境中的所有代码执行完以后，执行环境被销毁，保存在其中的变量和函数也随之销毁；(全局执行环境到应用退出时销毁)

一事无成的苦逼

我猜，看到这里，是不是觉得以上的理论很枯燥而且艰涩？因为基本上是从书上引用来的，不着急着理解，先摆在上面，等会结合案例回头再来看！相信你会恍然大悟，接下来请看样例:

在执行函数A的时候，创建了A的执行环境和变量对象，其中A的变量对象和全局变量对象中都含有a变量，根据作用域链从前向后查找，在A的变量对象中找到，所以输出1，执行完毕以后，A的执行环境销毁，A的变量对象由于没有被引用，所以也销毁；

上文我们提到了，由于作用域链的结构，外围函数是无法访问内部变量的，为了能够访问内部变量，我们就可以使用闭包，**闭包的本质还是函数。**也许你应该默认三遍这句话 **闭包的本质还是函数

**，因为它实在是太重要了

上面就是一个很简单的闭包例子，通过m函数，我们可以获得A函数内部变量的值，这个样例比较简单，看不出什么问题，接下来我们来深入了解一下。

每次执行A函数时，都会生成一个A的活动变量和执行环境，执行完毕以后，A的执行环境销毁，但是活动对象由于被闭包函数引用，所以仍然保留，所以，最终剩下两个A的变量对象，因此m1和m2在操作x时，指向的是不同的数据，

现在来回答三个问题:

1.(为什么连续执行m1的时候，x的值在递增?)

answer:因为m1在引用的活动对象A一直没有释放(想释放的话可以让m1=null)，所以x的值一直递增。

2.定义函数m2的时候，为什么x的值重新从1开始了?

answer:因为又一次运行了A函数，生成一个新的A的活动对象，所以m2的作用域链引用的是一个新的x值。

3.m1和m2里面的x为什么是相互独立，各自维持的？

answer:因为在定义m1和m2的时候，分别运行了A函数，生成了两个活动对象，所以,m1和m2的作用域链是指向不同的A的活动对象的。

好的，到这里先回顾一下前面说到的知识点:

执行环境和变量对象在运行函数时生成

执行环境中的所有代码执行完以后，执行环境被销毁，保存在其中的变量和函数也随之销毁；(全局执行环境到应用退出时销毁)

js高级设计

感觉理解了吗？接下来，再看看另一个很类似的例子:

这个例子和刚刚十分类似，不同的是，在A内部就先定义了两个函数，可以看出，最后的结果与上面的例子有些不同:

变量x仍然能保持递增，但是m[0]和m[1]定义的函数，对于x的改变不再是相互独立的，其实大家估计猜到了，这里的m[0]和m[1]的作用域指向的A的变量对象，其实是同一个，为什么呢?很简单，看看刚刚这段代码，其实是只调用了一次A函数，再看上文那句话:

执行环境和变量对象在运行函数时生成

既然A只执行一次，那么A的活动变量当然也就生成了一个，所以这里m[0]和m[1]的作用域指向同一个A的变量对象

这个例子其实算是一个经典案例，在很多地方都有提到，执行完毕后 funs数组中，funs[0]-funs[9]存的其实都是一样的,都是一个返回i值的函数，这个例子容易错误的地方其实在于，弄错了产生执行环境的时机，还是看这句话：

执行环境和变量对象在运行函数时生成

所以，当执行 var funs = A();时，只是定义函数，而没有执行，真正产生环境变量的时间是在console.log(funs0);这三句的时候，此时A的变量对象中i值是什么呢？很简单，看它return的时候，i的值，显然，i的值是10，所以，最后三句输出的都是10

二、闭包的作用

1.模仿块级作用域

首先简单举个例子来，解释一下什么是块级作用域：

在这个简单的函数中，变量i是在for循环中定义的，如果是在C++或者Java中，这样定义的变量，一旦循环结束，变量也就随之销毁，i的作用范围只在循环这个小块，就称为块级作用域。在javascript中，没有这样的块级作用域，前面一篇文章已经提到，变量是定义在函数的活动对象中的，因此，从定义i开始，在函数内部可以随时访问它。

这样的坏处显而易见：由于javascript不会告诉你变量是否已经被声明，容易造成命名冲突，如果是在全局环境定义的变量，就会污染全局环境，因此可以利用闭包特性来模拟块级作用域。不过在此之前要先介绍另一个知识点：匿名立即执行函数。如果已经比较熟悉的同学可以直接跳过这一块：

匿名立即执行函数

首先举个例子(我比较喜欢举例，感觉看例子比较更容易理解)：