每日一题（二四）function getName(){for(let i=0;i5;i++){setTimeout(_=>{console.log(i)},i*10)}return{name:'a'}

最新推荐文章于 2023-01-11 14:30:10 发布

原创最新推荐文章于 2023-01-11 14:30:10 发布 · 1k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#每日一题 #前端面试题 #JS基础 #let

温故知新专栏收录该内容

95 篇文章

订阅专栏

本文探讨JavaScript中定时器与let变量作用域的微妙互动，解析为何定时器输出特定序列，而非预期结果。深入理解JavaScript引擎如何处理return语句后的自动分号插入，以及let与var声明变量在循环中的不同表现。

题目描述：写出打印结果，并解释为什么

function getName(){
    for(let i=0;i<5;i++){
        setTimeout(_=>{
            console.log(i)
        },i*1000)
    }
    return 
        {
            name:'aaa'
        }
}

console.log(getName())

答案：

undefined
0
1
2
3
4

解析：

1.第一点：undefined，这是因为 return 语句后面换行了，js 会在return 语句后面自动添加分号。分号自动添加的情况：

如果下一行的开始与本行的结尾连在一起解释，JavaScript 就不会自动添加分号
只有下一行的开始与本行的结尾无法连在一起解释，JavaScript 引擎才会自动添加分号
如果一行的起首是 ++ 或 -- 运算符，则他们后面自动添加分号
如果 continue break return throw 这四个语句后面，直接跟换行符，则会自动添加分号

2.第二点：let 变量除了作用域是在 for 区块中，而且会为每次循环执行建立新的词法环境，因为是用 let 声明的，所以每个 i 都是一个作用域，这里如果用 var 声明则最后输出都是 5

扩展：

function getName(){
    for(var i=0;i<5;i++){
        setTimeout(_=>{
            console.log(i)
        },i*1000)
    }
    return {
        name:'aaa'
    }
}

console.log(getName())