JavaScript中let和var的区别是什么？

大家好！我刚开始学习JavaScript，遇到了一个让我困惑的情况。当我用`var`和`let`声明变量时，代码表现不同，我不明白为什么。\n\n下面是一个让我困惑的例子：\n\n```javascript\nfunction test() {\n if (true) {\n var x = 10;\n let y = 20;\n }\n console.log(x); // 10\n console.log(y); // ReferenceError: y is not defined\n}\n```\n\n为什么`x`在`if`块外部可以访问，而`y`不行？我以为两个变量是在同一个地方声明的。\n\n另一个关于循环的例子：\n\n```javascript\nfor (var i = 0; i < 3; i++) {\n setTimeout(() => console.log(i), 1000);\n}\n// 输出：3 3 3\n\nfor (let j = 0; j < 3; j++) {\n setTimeout(() => console.log(j), 1000);\n}\n// 输出：0 1 2\n```\n\n为什么循环中的`var`表现如此奇怪？我原本期望两个版本都输出0, 1, 2。我哪里做错了？这两种变量声明方式之间根本的区别是什么？感谢解答！