经典面试题之JavaScript for循环(var let)
更新时间：2023年10月26日 11:58:16 作者：samllplum
如果你也在面试找工作,那么也一定遇到过这道for循环打印结果的题,下面我们来探讨下,对经典面试题之js for循环相关知识感兴趣的朋友跟随小编一起看看吧
如果你也在面试找工作，那么也一定遇到过这道for循环打印结果的题，下面我们来探讨下
var循环
for(var i = 0; i < 10; i++) {
setTimeout(function(){console.log(i)});
}先把答案写出来
下面来讲一下原因：
划重点
① var
②setTimeout()
重点1：你需要了解一下变量提升（hoisting）
var变量声明，无论发生在何处，都在执行任何代码之前进行处理。
用var声明的变量的作用域是它当前的执行上下文，它可以是嵌套的函数，也可以是声明在任何函数外的变量。如果你重新声明一个 JavaScript 变量，它将不会丢失其值。
然后上面的代码其实是这样的
var i = 0;
for (; i < 10; i++) {
setTimeout(function () {
console.log(i)
})
}重点2、setTimeout()
它总是在当前的同步代码执行完成后开始运行。(出自简书---一斤代码)
可以加入log进行跟踪验证：、
var i = 0;
for (; i < 10; i++) {
console.log('+++++', i)
setTimeout(function () {
console.log(i)
})
}执行结果：
+++++ 0
+++++ 1
+++++ 2
+++++ 3
+++++ 4
+++++ 5
+++++ 6
+++++ 7
+++++ 8
+++++ 9
10
10
10
10
10
10
10
10
10
10
由此可见，当开始执行setTimeout()中的代码时for循环外面的变量i就已经变成了10，使用console.log(i)从作用域查找到的i值就是10，然后循环十次10。
let循环
ES6的let/const，简单来说let/const是声明块级作用域的变量
for(let i = 0; i < 10; i++) {
setTimeout(function(){console.log(i)});
}下面是打印结果：
到此这篇关于经典面试题之JavaScript for循环（var let）的文章就介绍到这了,更多相关js for循环内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了JS实现图片预览的两种方式,非常不错，具有参考借鉴价值，需要的朋友可以参考下2017-06-06
本来是很简单的一个功能，可是一开始弄的时候，还有IE能实现，FF总是不能实现，在网上看了半天，也没弄出个所以然，所以在同事的帮忙下，总算弄出来了，浏览器的兼容性考的还是细节上面的东西，所有关于细节的，我会用注释标出来的。2015-05-05
JavaScript是一种广泛使用的脚本语言,用于开发网页和应用程序,在Web开发中,经常需要获取浏览器窗口的尺寸,以便根据窗口大小进行布局或执行其他操作,本文将介绍如何使用JavaScript来获取浏览器窗口尺寸,需要的朋友可以参考下2023-11-11
使用typescript+webpack构建一个js库的示例详解
这篇文章主要介绍了typescript+webpack构建一个js库,本文主要记录使用typescript配合webpack打包一个javascript library的配置过程，需要的朋友可以参考下2022-07-07
本案例是参考cropper站点实例，进行修改简化。接下来通过本文给大家分享Cropper.js 实现裁剪图片并上传(PC端) 功能，需要的朋友参考下吧2017-08-08
这篇文章主要介绍了JavaScript使用cookie实现记住账号密码功能,本文直接给出完整测试代码,需要的朋友可以参考下2015-04-04
这篇文章主要介绍了JS实现的JSON数组去重算法,结合实例形式分析了javascript针对json数组的遍历、判断实现去重复功能相关操作技巧,需要的朋友可以参考下2018-04-04
这篇文章主要介绍了Postman动态获取返回值过程详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-06-06
这篇文章主要给大家介绍了关于微信小程序npm引入vant-weapp的踩坑记录，文中通过示例代码介绍的非常详细，对大家学习或者使用微信小程序具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2019-08-08
下面小编就为大家分享一篇webpack下实现动态引入文件方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-02-02
最新评论