js中闭包常见面试问题

function A() {
let a = 1
function B() {
console.log(a)
}
return B
}

从代码中就可以大概看出闭包的定义:函数 A 返回了一个函数 B,并且函数 B 中使用了函数 A 的变量,函数 B 就被称为闭包。
经典面试题,循环中使用闭包解决 var 定义函数的问题

for ( var i=1; i<=5; i++) {
setTimeout( function timer() {
console.log( i );
}, 1000 );
}
console.log( i );

上面函数首先输出最后一行的i为6 之后隔1s同时输出5个6;
首先因为 setTimeout 是个异步函数,所有会先把循环全部执行完毕,这时候 i就是 6 了,所以会输出一堆 6。
解决办法两种,第一种使用闭包

for (var i = 1; i <= 5; i++) {
(function(j) {
setTimeout(function timer() {
console.log(j);
},  1000);
})(i);
}

第二种就是使用 setTimeout 的第三个参数(第三个参数详细请看MDN在这里插入图片描述
定时器启动时候,第三个以后的参数是作为第一个func()的参数传进去。

for (var i = 1; i <= 5; i++) {
(function(j) {
setTimeout(function timer() {
console.log(j);
},  1000);
})(i);
}

第三种就是使用 let 定义 i 了

for ( let i=1; i<=5; i++) {
setTimeout( function timer() {
console.log( i );
}, 1000 );
}

因为对于 let 来说,他会创建一个块级作用域,相当于

{ // 形成块级作用域
let i = 0
{
let ii = i
setTimeout( function timer() {
console.log( i );
}, 1000 );
}
i++
{
let ii = i
}
i++
{
let ii = i
}
...
}
### JS中的闭包面试题简述 **闭包(Closure)** 是JavaScript中一个非常重要的特性,它允许函数访问其词法作用域(lexical scope),即使这个函数在其词法作用域之外被执行。简单来说,闭包就是函数与其声明时所在的作用域环境绑定在一起的结果。 #### 面试题示例: 1. **经典计数器问题** ```javascript function createCounter() { let count = 0; return function() { count++; console.log(count); } } const counter = createCounter(); counter(); // 输出: 1 counter(); // 输出: 2 ``` 这里的`createCounter()`返回了一个匿名函数,并且该匿名函数可以持续地访问并修改外部变量`count`的值,这就是典型的闭包应用案例之一。 2. **立即执行函数表达式 (IIFE) 和闭包结合使用** ```javascript var name = "global"; (function() { var name = 'local'; function displayName() { console.log(name); } window.displayName = displayName; })(); displayName(); // 输出:"local" ``` IIFE创建了局部作用域,其中定义的`displayName`函数形成了对内部`name`变量的一个闭包引用,在全局环境中调用`displayName`时仍然会输出“local”。 3. **循环内的异步操作与闭包陷阱** 下面的例子展示了如何避免常见闭包错误: ```javascript for(var i = 0; i < 5; i++) { setTimeout(function() { console.log(i); // 打印五次数字5!这不是预期结果。 }, 1000 * i) } // 改进版本 for(let j = 0; j < 5; j++) { setTimeout(() => { console.log(j); // 每隔一秒打印从0到4 }, 1000 * j) } ``` 第一个例子由于`var`关键字不具备块级作用域而导致所有回调共享相同的`i`变量;第二个改版则利用ES6引入的`let`来替代`var`,使得每个迭代都有自己独立的作用域链表项,解决了这个问题。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值